[MINI TIP] How to Make all links that leads out of your site open in a new tab.

[Elson Tan]

Hi,

So here's a mini tip:

How to Make all links that leads out of your site open in a new tab.

That means , links that doesn't contain your network domain , will be opened in a  new tab. This method can be used so that your network doesn't lose precious traffic because of external links.

 

Normally if we do it using HTML , we will just add a target="_blank" attribute to it. What if user put an external in a comment , we can't edit the content.

<a href="externallink" target="_blank">External Site</a>

 

This is when the awesome jQuery steps in, just copy this code into your custom code:

<script type="text/javascript">
if (typeof(x$) != 'undefined') {
   //look at each links on your network
   //if link has http
   x$("a[href^=http]").each(function(){
     //if the link does not contain your hostname (yournetwork.com)
      if(this.href.indexOf(location.hostname) == -1) {
        //add attribute target to it to open in new tab
         x$(this).attr('target','_blank');
      }
   }); //end of each function
}
else{
}
</script>

 

I'm using jQuery's .each() and .attr() to get the work done.

Location.hostname is to get your domain name mynetwork.com

.indexOf is use to see if a string contains something.

== -1 That means does not exist! 

 

That's it. Hope you like it.

[Jordon McGee (Jords)]

Great tip!

[Alexander Korf]

thanks, great script!

[Armani Rouse]

excellent tip Elson, right on brotha!

[Scott Bishop]

This is an important mini tip. Question, I have 2 websites meshed as 1 (Ning with a .php site).

How would you write it so both sites stay on target?

[Elson Tan]

Try this , replace otherdomain.com/file.php with your other site link:

<script type="text/javascript">
if (typeof(x$) != 'undefined') {
   //look at each links on your network
   //if link has http
   x$("a[href^=http]").each(function(){
     //if the link does not contain your hostname (yournetwork.com)
      if(this.href.indexOf(location.hostname) == -1 || this.href.indexOf('otherdomain.com/file.php') == -1) {
        //add attribute target to it to open in new tab
         x$(this).attr('target','_blank');
      }
   }); //end of each function
}
else{
}
</script>

[George H. Compton IV]

This is a great tip thank you Elson :)

[Manuel France]

MINI??? MAXI!!! Thank you VERY much Elson

[Elson Tan]

glad you all like it.

[Tyler Durbin]

That worked AWESOME Elson!  Thanks!!!

[Abel I. Arenivar]

Gracias me funciono de maravilla.

[JFarrow]

i covered this back in 2011 here but i like your solution much better!

[Elson Tan]

Cool. I didn't know someone covered it when I posted. Sorry.