I received an e-mail yesterday evening from someone using some old ExpressionEngine plugin of mine.  Specifically it was Rewrite Links, and I have long since orphaned this.  The story behind this plugin was that my content people did not consistently use target=”_blank” for outbound links.  At the time, ExpressionEngine was new to me and I was trying to use it as the hammer for every nail I found.

That was a dumb way to go.  About a month later I found several bugs with the methodology and realized the code path was fundamentally flawed.  As I am still in denial about making such a poor engineering choice so I will avoid discussing what I messed up and move on to my solution.  Long story short, the above e-mailer had run into these bugs as well and was curious if I had seen and solved them.

I am getting rather good with jQuery.  Good enough to be dangerous anyways.  My solution for some time has been a little jQuery snippet in my footer.  The absolute minimal approach is to stick this at the end of the page (or in a $(document).ready() call):

  $("a[@href^='http']").attr('target', '_blank');

This bit looks at all the A tags in the page, then filters down to tags with the characters http in the href attribute.  All results get target=”_blank” added to them.  Very simple, fast and effective.  We can even expand the concept a bit in a number of ways.  Most useful to me has been to use the .each() iterator with it.

  $("a[href^='http']").each(function() {
    if( $(this).attr('href').indexOf('localdomain.com') < 0 ) {
      $(this).attr('target', '_blank');
    }
  });

This is getting to be a pretty powerful bit of code.  Going back to my content people, they all seem to use different types of links for on-site stuff.  Some of them use a relative path.  Some of them use absolute paths.  Some of them use absolute paths without the WWW. in front of our domain.  We force that in our .htaccess file.  The above snippet applies this logic:

• All link tags
• That contain http
• That do NOT contain localdomain.com
• Add the attribute target=”_blank”

This has proven to be pretty effective for us.  It is important to leave out the WWW. from your localdomain.com in the IF conditional.  Some users will use it, some will not.  Your site might force WWW, it might force NON-WWW, or it might not care.  By using the 2nd level naming only and dropping the 3rd, you will get what you intend with less fuss and failures.

If you really REALLY wanted to, you could even replace the hard-coded ‘localdomain.com’ string with document.domain.  To keep things sane, just check for and truncate any WWW. from the return and you have code you never need to touch.

Maybe something kewl like this, tossing some :not() selectors into the mix:

  $("a[href^='http']:not(a[href^='http://" + window.location.host.toLowerCase() + "']):not(a[href^='http://www." + window.location.host.toLowerCase() + "'])").attr("target", "_blank");