Automatically Open all External Links in a New Window On Blogger


Auto Open all External Links in New Windows or Tabs



Got some post on your blog which have external links to other sites? then add this to a list blogger tips and tricks you've known so far, that is, automatically Opening all external links in a new window on your blog. In the blogger post editor, all links both internal and external have the same format which is, opening in the same window when clicked on. If you have external links in your blog post, then to make them appear in a new window, you'll have to manually add target="_blank" in all the links. This can be cumbersome, atimes you might forget to include it in the links and will also take more time especially if you want to edit the links and add target="_blank" for those who aren't implementing it already.


One of the advantages of opening external links in a new window is that it increases a blog's pageviews. Without opening external links in a new window, readers can leave your blog without reading the post completely or viewing any other post on your blog because they clicked on an external link. This can increase your blog's bounce rate. With this blogging tip/trick, all internal links will be opened in the same window while external links on your blog will be opened in new windows. The script below finds external hostnames and inserts into the html a target attribute which opens the link in a new window.

Also Read:   How To Embed PDF, DOC, XLS And PPT Files In Blogger
                   How to Disable Right Click On Blogger - Stop Copy Paste
                   Add Read More Attribution Links to Copied Text in Blogger


How to Automatically Open all External Links in a New Window On Blogger



1. From your blogger dashboard, click on template, select edit html
2. Click inside your template, Using ctrl+f keys, search for </head>
3. Copy the jQuery code below and paste above </head> (only for those who don't have it in their template. Skip to (4) if you already have this Jquery code)


<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'></script>


Also Read: How  to Make Your Blog Post SEO Friendly
                 Allow Search Engines to Index Your Blog Fast 


4. Copy the script below and paste directly above </head>


<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>

5. Save your template. Click on any external link on your blog and it'll open in a new window.

Do you like this post? Please link back to this article by copying one of the codes below.

URL Of Post:


HTML Link Code:

BB (forum) link code:

Comments

  1. ahh this is great, thanks for sharing the tip!

    ReplyDelete
  2. Hi Gracia,
    It's a wow tutorial on how to automatically open all external links in a new window on blogger. You've given some reasons as to why it's essential, and I think this is going to be very useful for blogger using the blogger blogging platform.

    Thanks for sharing, and do enjoy the new week

    ReplyDelete

Post a Comment

Please share your views on this topic with Grace Joseph by leaving a comment.