Make External Links Open in a New Window With This jQuery Plugin

Here’s a common problem. You want to make all of your links on your site that would lead visitors away to open in separate tabs. For example, if I wanted to tell you about this cool article by Troy Goode about working with LINQPad as part of a larger conversation, I probably would have it open in a new tab (as the one above does).

Of course, you can do this by adding target=”_blank” to all your external links, but that’s tedious to say the least. So here is a simple jQuery plugin I created to do the trick. (Yes I know there are others, but none seem quite right, so here is yet another.)

Download: Query.externalLinks

The usage is pretty easy. Pick a section to scan for external links and say go:

Here is a simple example (from my previous post on hotkeys). Click on the title or the twitter icon in the lower right to see it in action.

Currently, it works by adding target=”_blank” to all fully-qualified links. For example, the first link will be a new window, the second won’t:

<a href=”http://www.google.com”>google</a&gt;
<a href=”/contact”>contact me</a>

Hope you find it helpful.

Cheers,
@mkennedy

 

 

Michael Kennedy

A Python enthusiast and an entrepreneur. Host of Talk Python and Python Bytes podcasts, founder of Talk Python Training. Python Software Foundation Fellow.

Tags:

Submit a comment