How to Automatically Open All External Links in a New Tab/Window


Adding target="_blank" to each hyperlink on your blogger blog makes all external links open in a new tab. This is a manual method and most of the time we bloggers can forget to add target blank tag towards the external link so when visitors click on an external link, they may leave your site because you have not set mark blank about the URL.

If you can't keep doing this on every external link in your blog I will be showing you on How To Automatically target blank to make All External Links in your blog Open in a New Tab/Window.


The Pros and Cons on How to Automatically Open All External Links in New Tab/Window

Pros:
[*] This makes all external links open in a new tab thus making visitors stick to your website when they click on an external link.
[*] This would not affect your inner links.

Cons:
[*] New tabs/windows keep opening whenever an external link on your blog is being clicked.

Steps on How To Automatically Open All External Links in New Tab/Window

Step 1: Go to Blogger Dashboard >> "Theme" >> click on the "Edit HTML" button.


Step 2: Click anywhere inside the HTML code area and press the CTRL + F keys to open the Blogger search box.


... type or paste the following tag into the search box and hit Enter to find it:
</head>

Step 3: Copy the below code and paste it just above the </head> tag.

Code:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'/>
    <script type='text/javascript'>
    $(document).ready(function() {
      $(&quot;a[href^=&#39;http://&#39;]&quot;).each(
        function(){
         if(this.href.indexOf(location.hostname) == -1) {
            $(this).attr(&#39;target&#39;, &#39;_blank&#39;);
          }
        }
      );
    $(&quot;a[href^=&#39;https://&#39;]&quot;).each(
    function(){
    if(this.href.indexOf(location.hostname) == -1) {
    $(this).attr(&#39;target&#39;, &#39;_blank&#39;);
    }
    }
    );
    });
    </script>



Configuration:

[*] Don't add the code on red if you already have jQuery library code installed on your blog.

Step 4: Click on the Save Theme button.


Thanks and don't forget to hit the share button!