Powered by Blogger.

Automatically Open all External Links in a New Window in Blogger!


We sometimes put links in our posts. And naturally our visitor will click on those links. By default when a link is clicked it will open in the same window.

If your blog is like mine where visitors only come in once, keeping them in your blog once they come in is crucial. We wouldn't want them visitors disappear from our blog through outbound links, now would we?

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.

As usual Go to Blogger >> Template >> Click "Edit HTML"

Just above </head> paste the following script:
<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>
Please do not add the red code if you already have jQuery library source code installed on your blog.

Save your template and you are all done!

Check your blog and click some external links to see it working just fine!

0 comments:

Post a Comment