We sometimes put links in our posts. And naturally our visitor will click on those links. By default when a link is clicked it will open in the same window.
If your blog is like mine where visitors only come in once in a blue moon ha-ha, keeping them in your blog once they come in is crucial. We wouldn't want them visitors disappear from our blog through outbound links, now would we?
But don’t worry guys, we can prevent or at least delay this by opening the links in a separate window or tab. This can be achieved by giving the appropriate value for
target attribute in your link’s HTML.
I. Two methods of opening a link in a separate window (or tab)
Use the code below:
<a href="YourLinkUrl" target="windowname">anchor text</a>
where windowname is the name of your target window. (Note: Anchor text a.k.a link text is the visible part of the link , the one you click on).
- Method 1: Replace "windowname" with
_blank, like so:
<a href="YourLinkUrl" target="_blank">anchor text</a>Using this method, a browser will open a new window or tab each time you click the link. If you click 3 times, it will open three windows.
Method 2: Replace "windowname" with a name of your choice, like this:
<a href="YourLinkUrl" target="MyNewWindow">anchor text</a>With this method, a browser will open a new window named MyNewWindow (or whatever name you give). If the window doesn’t exist, it will create one. If you click 3 times it will still open just one window –the window you specified. You might want to use this method if you want to limit the number of windows opened.
II. Setting a default target window
The two methods above are for individual links, which means you have to specify the target window for each link one by one.
There is a simpler way though, using
target attribute. The
target attribute will set the default window for the whole page. Put this tag after the
<head> tag at the top of your template HTML. For example if you want to open all links in a new window named MyNewWindow then the code will be like this:
<base target="MyNewWindow" />
To open in a new window, replace
And of course, if you do specify the target window in an individual link after this, the new target window will override the target window specified by
<base target…../> tag (for that particular link).
Update 1: Blogger (blogspot) LinkList gadget
In Blogger Help Forum, people always ask how to open LinkList links in new windows. Okay this is the answer:
- Go to Template > Edit HTML.
- Click inside the code window and press Ctrl+F on your keyboard. A search box will appear in the upper right corner of the window.
- Find the following code using the search box. This code is a part of LinkList gadget's code:
atag, like this:
<li><a expr:href='data:link.target' target="_blank"><data:link.name/></a></li>
Update 2: Blogger (blogspot) Pages/PageList gadget
To open pages in new windows, follow similar steps to that of a LinkList gadget above. However, look for this code instead:
<li class='selected'><a expr:href='data:link.href'><data:link.title/></a></li> <b:else/> <li><a expr:href='data:link.href' ><data:link.title/></a></li>
target="_blank" inside both
a tags, like this:
<li class='selected'><a expr:href='data:link.href' target="_blank"><data:link.title/></a></li> <b:else/> <li><a expr:href='data:link.href' target="_blank"><data:link.title/></a></li>
Note: Setting a link to
target="_blank" tells browsers to open it in a new window. Now whether the link opens in a new tab or in a new window, that depends solely on each user’s browser setting.
Update: Many readers asked me for this, so here it is: How To Make Only External Links Open In New Windows