Open All External Links or/and Internal Links in New Tab: Blogger

Open all the External Links or Internal Links or Both Links in New tab automatically by using a simple jQuery script. Don't need target='_blank' to add each time in hyperlink tags.

Author: Mohammad Shadab

Do you want your visitors stay on your site for a long time? Read more articles instead of just one page? An easy solution is to create target="_blank" to each of your external links so that when a user clicks on your external links your webpage remains open while the external links open in the new tab. To do it, you have only two options either you can create it manually, including target='_blank' in each external link's html tags, or you can create it automatically by using the following script in your blogger. The following script will add target='_blank' to all of your external links automatically that means all the external links will now open in a new tab in your blogger blogs. I have also included the parts by which you can make a rule to open all of your internal links or both links (internal and external) in new tab. Let's talk about the advantage when using all the external links to open in new tab.

Advantage: Open All External Links in New Tab

• "Daily time on site" will be increased.
• "Daily pageviews per visitors" will be increased.
• Bounce rate improvement.

If you want to use manual method, go to your post editor, and while creating your link just checking the checkbox of "open this link in a new window" as show in the following preview. Once you check the following box this property will add another attribute target="_blank" to your hyperlink tag.

However, there are few solutions which allow us to add target="_blank" attribute automatically on each links contained in the blog posts. You can make your all external links to open in new tab or all internal links to open in new tab or you can also make this rule for all of your internal and external links. We'll discuss it for each case.

How to Open All External Links in New Tab

To open all the external links in new tab, we'll use a jQuery script. Go to your Blogger Dashboard -> Select your Blog -> Template -> Edit HTML. Now, click anywhere in the code and open the search box using Ctrl + f, and find </head> code. Now, copy the following code and paste just above to </head> code. Note: Don't add the red line code which is a jQuery library code, if your blogger template already using it. You can easily checkout by using a search if your template already contained it.

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

Since, while using external links either you can use 'http' version of a site or 'https' version of a site so we have added both version. The above jQuery script will work on each of your external links only. It would not affect any internal links inside your blog. Whenever the script finds any external link inside your blog, it will automatically add a target attribute with the value of '_blank'.

How to Open All Internal Links in New Tab

What if you want to open all of your internal links (except external links) in new tab, Just use the following jQuery script instead of the above script. Note: Don't add the red line code which is a jQuery library code, if your blogger template already using it. You can easily checkout by using a search if your template already contained it.

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

Now, the above jQuery script will detect all the internal links inside your blog, and adds automatically target attributes with the value '_blank'. The current script would not affect any external links.

How to Open All Internal & External Link in New Tab

To open all the external & internal links in new tab, follow simple steps. Go to your Blogger Dashboard -> Select your Blog -> Template -> Edit HTML. Now, click anywhere in the code and open the search box using Ctrl + f, and find </head> code. Now, copy the following code and paste just above to </head> code.

<base target='_blank'/>

Once you added this code to your blogger template, all the internal and external links will now open in new tabs. However, you may want to open few links in the same tab. To do it, just add an additional attribute, target="_self", while creating your link in blogger post editor HTML tab. i.e., <a href='your link' target='_self'>your text</a>. Conclusion: Open external links to new tab might improve your bounce rate, time on site and pageviews. I have added the easiest way to handle it automatically. You can share your thought by the following comments.