Tutorial: How To Make Links Open In New Tab

In my last post, I asked whether links should open in new tabs or not.

While I was thinking that most people like links in same tabs, more people voted and commented in support of new tabs. So, I have decided to make external links on Blogging With Success open in new tabs for now.

In this tutorial, I will discuss different methods of making a hyperlink open in new tab.

WordPress

WordPress offers following ways to open links open in new tab:

Manually

Doing it manually takes time but is fine since you have complete control over the links that should open in new tabs and the ones which should not. To make links in your post open in new tab, use the following steps.

  1. When writing post, once you have written the link text, click the "Insert/Edit Link" button in editor. A popup like following will open:WordPress Link Popup
  2. Enter the address of target page. For example, if you want to link to Blogging With Success, enter bloggingwithsuccess.net in URL field.
  3. Now, click "Target" drop down and select "Open Link In New Window".
  4. Click Insert.

That will do the job for anything included in posts.

However, manual method is a big problem if you have a big archives or have sidebar widgets pointing to external pages.

But in that case, we have......

Plugins

It has been quite some time since I wrote about WordPress Plugins. Isn't it?

But since plugins can make the task easier for you, here are some options:

  1. JAB External Link New Tab: This plugin will use javascript to your template code so that all external links(including ones in comments) will open in new tabs. Just install and forget.
  2. Open In New Window Plugin: Similar to JAB plugin. However, it is listed as WordPress 3.1 compatible while JAB is not. May work if JAB does not.
  3. Open External Links In A New Window: This plugin claims to do the things differently. Excerpt from plugin page: Most other plugins perform a hack by altering the target parameter (i.e. < a href="http://somewhere.example" target="_blank" >). That method is not XHTML Strict compliant. This plugin handles the links client-side, which lets search engines follow the links properly.

Blogger And Other Platforms

I tried Blogger but looks like there is no easy method. So, you will have to edit some code. However, it is very simple.

Once you have finished editing your posts, go to HTML view. The code looks like following:

 <a href = "http://bloggingwithsuccess.net">Blogging With Success</a> 

Where, Blogging With Success is anchor text and link points to http://bloggingwithsuccess.net/

If you want to make link open in new tab, just add target = "_blank" after URL. For example, above link will become:

 <a href = "http://bloggingwithsuccess.net" target = "_blank">Blogging With Success</a> 

That should do the job.

Any Questions?

Any questions? Feel free to ask in comments.

Do not forget to share this post.

About Ishan Sharma

Hi, I am a young Blogger from India. I am very passionate about blogging and also co-founder of Blogging With Success. I write about general blogging tips and WordPress. You can read other posts by me here.If you need help, feel free to contact anytime!

Comments

  1. Thanks but isnt there a way to make all outbound links open in a new tab ?

  2. This is very basic, but still i am glad that you have listed it out here, i am sure this will be beneficial for newbies

  3. Using the manual WordPress option has always been my choice. Any blog with a great amount of plugins can open slower. Thus, this is why I’ve chose to stick to the manual option. Although, it’s great to see other options!

  4. Thanks for sharing this and making it easy. I’m going to get that plugin…simplicity is always the best route for me! Thanks.

  5. I already knew how to do this before, but didn’t know a wordpress plugin existed to make the work easier. Will definitely install the plugin now, thanks so much Ishan for going deeper and making the plugins available.

  6. Hi Ishan,
    That open in new window plug-in looks good. Would save a bit of time and hassle.
    Thanks for the heads-up.
    Pete

  7. Hi Ishan,

    Very nice job! I’m sure this will help many how to make links open in a new tab. Thanks for sharing

  8. It’s quite easy to manage that your links open in new tab. Isn’t it. ;)

    • Hi Shailender,
      Yes, it is very easy. Add a plugin and it is effortless!
      Thanks for commenting.

  9. A good article. I use the manual method myself (and is made easier in WordPress 3.1) as I’ve been opening external sites in new tabs since I first set up my site. Glad to hear I made the right choice ;)