How to Open All External Links to New Tab Automatically in Blogger

This content will explain how you can automatically targeted blank to every external links attached with your blog posts. Most of the times, bloggers forget to add target blank tag towards the external link so when the visitor click the external URL, visitor may leave your blog because you might have not set the mark blank about that URL. I am going to tell you with a simple jQuery code which immediately set all the target blank tags to all external links. By adding this code in your blog template each of the external back links will be open in a new tab while your visitor stick to your web site. It wont effect on you inner linking. So lets see how to add this script to your blogspot blog.


Here's following the easy step.

1- Go to your Blogger Dashboard
2- Go to Template  >>  Edit HTML 
3- In the HTML code box, press Ctrl+F, then type the tag
</head>

4- Copy the following code and paste just before/above the </head> tag


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

Note: Do not add the red code if you already have jQuery library code installed in your blog.

5- Save template

That's it!
Don't forget to share to your friends by clicking sharing button below.

Post a Comment

أحدث أقدم