how to open external links in a new window in wordpress

Table of Contents

How to Open External Links in a New Window in WordPress

As a seasoned WordPress expert with over 15 years of experience, I’ve witnessed countless website owners struggle with the common problem of losing visitors to external links. It’s frustrating to put effort into creating engaging content only to have readers click away and potentially never return. This is why opening external links in a new window or tab is crucial for a seamless user experience and boosting engagement on your WordPress website.

Think of it this way: Your website is like a cozy bookstore. You want visitors to browse your selection, discover intriguing titles, and perhaps even purchase a book or two. But if they step outside the bookstore every time they find a book they want to learn more about, they might forget where they were and never come back. Opening external links in a new window or tab is like providing a comfortable reading area within the bookstore itself. Your visitors can explore other authors and titles without losing their place within your curated collection.

By keeping visitors engaged on your site, you increase the chances of them subscribing to your newsletter, following you on social media, leaving comments, and even making purchases. In short, opening external links in a new window or tab is a simple yet powerful strategy that can make a significant difference in your website’s overall success.

Why Open External Links in a New Window or Tab?

External links are links to websites that you don’t own or control. Typically, when you add a link to an external website, visitors simply leave your site by clicking on the link. While some user experience experts argue against opening external links in a new window or tab, I firmly believe it’s a best practice.

Here’s why:

Improved User Experience: Most users struggle to remember the last website they visited. Clicking a link that takes them away from your WordPress website to a new site can lead them to forget where they came from and never return. Opening external links in a new window or tab ensures that the original webpage remains accessible, allowing users to easily switch back and continue browsing your website.
Increased Page Views and Engagement: When users spend more time on your site, they are more likely to engage with your content, sign up for your email list, follow you on social media, leave comments, and purchase your products. Opening external links in a new tab encourages users to stay on your site, leading to higher page views and increased engagement.
Reduced Bounce Rate: By keeping users on your site, you can reduce your bounce rate, a metric that measures the percentage of visitors who leave your site after viewing only one page. A lower bounce rate signals to search engines that your site is valuable and engaging, which can improve your search engine rankings.

Methods for Opening External Links in a New Window in WordPress

Now that you understand the benefits, let’s explore the various methods you can use to open external links in a new window or tab in WordPress. I’ll guide you through each option, providing clear instructions and helpful tips along the way.

1. Opening External Links in a New Tab Using the Block Editor

The WordPress block editor, also known as Gutenberg, offers a built-in feature that allows you to open external links in a new tab. This option is conveniently available when adding a link.

Edit the blog post or page where you want to add an external link.
Select the text you want to link and click the ‘Link’ button (or press CTRL+K on Windows or Command+K on Mac).
In the insert link popup, enter the link and press ‘Enter’.
Toggle the ‘Open in new tab’ option to the ‘On’ position.

The link will now open in a new tab.

Tip: You can also add title and nofollow attributes to the insert link popup by installing the All in One SEO plugin. These attributes provide additional information to search engines and improve your website’s SEO.

2. Opening External Links in a New Tab Using the Classic Editor

While the block editor is the recommended editor for WordPress, some users may still prefer the classic editor. If you’re one of them, here’s how to open external links in a new tab using the classic editor.

Edit the post or page where you want to add the link.
Select the text you want to link (anchor text).
Click the ‘Insert/edit link’ button.
In the popup, add your external link.
Click the gear icon next to the link.
In the advanced insert link popup, check the ‘Open link in a new tab’ option.
Click the ‘Update’ button to add your link.

3. Opening External Links in a New Tab Using HTML Code

In certain situations, you might need to use HTML code to add links in WordPress. This is often necessary when using the HTML mode in the block editor or when adding links in a WordPress theme template file.

Here’s how to add a link that opens in a new tab using HTML code:

  <a href="http://example.com" target="_blank" rel="noopener">Link Text</a>

The target="_blank" parameter in this code instructs browsers to open the link in a new window or tab. Replace “example.com” with the external link URL and “Link Text” with the anchor text you want to use.

Important: The rel="noopener" attribute is crucial for security reasons. It prevents the linked website from gaining access to your website’s context, potentially mitigating security vulnerabilities.

4. Opening Navigational Menu Links in a New Tab

You can also add external links to your website’s navigational menu. The process for doing so depends on whether you’re using a traditional theme or a block theme.

Opening Nav Menu Links in a New Tab for Classic Themes

Go to ‘Appearance » Menu’ in your WordPress admin area.
Click the ‘Screen Options’ button at the top right corner of your screen.
Check the option for ‘Link Target’ under ‘Show advanced menu properties’.
Add a Custom Link to your navigational menu by entering the URL, Link Text, and clicking the ‘Add to Menu’ button.
Select the option for ‘Open link in a new tab’ for your Custom Link in the Menu Structure column.
Click the ‘Save Menu’ button.

Opening Nav Menu Links in a New Tab for Block Themes

Go to ‘Appearance » Themes’ and use the Full Site Editor.
Click the header area at the top of the page, then click the navigation area to the left of the menu.
Click the ‘+’ sign at the end of the menu to add a new link.
Click the ‘+’ icon in the popup to add a link. Enter the URL and toggle ‘Open in new tab’ to the ‘On’ position.
Click the ‘Submit’ icon next to the URL to store your settings.
Click the ‘Save’ button at the top of the screen.

Tip: If you find it difficult to select blocks in the Full Site Editor, use List View. Click the icon at the top of the screen and find the Navigation block, which may be nested within other blocks.

5. Automatically Opening All External Links in a New Tab Using a Plugin

Manually checking the ‘Open in new tab’ option for every external link can become tedious, especially if you run a multi-author blog or frequently forget to apply this setting. This is where a plugin can come in handy.

The Open External Links in a New Window plugin is a popular option. It works out of the box, automatically opening external links in a new window. It doesn’t modify the external links in your blog posts; instead, it uses JavaScript to open them in a new window.

Note: Deactivating the plugin will stop external links from opening in a new window.

6. Automatically Opening All External Links in a New Tab Using Code

If you consistently forget to set external links to open in a new tab while writing blog posts or want to enforce this practice for guest contributors, you can use code snippets. This method ensures that all external links in your posts automatically open in a new tab.

Here’s how to do it using the WPCode plugin:

Install and activate the free WPCode plugin.
Go to ‘Code Snippets » Library’ in your WordPress admin dashboard.
Search for the ‘Open External Links in a New Tab’ snippet.
Hover over the snippet and click the ‘Use snippet’ button.
In the WPCode snippet editor, toggle the switch at the top of the page from ‘Inactive’ to ‘Active’ and click ‘Update’.
Click the ‘Update’ button again to store and activate the code snippet.

That’s it! All external links added in your WordPress posts will now automatically open in a new tab.

Expert Guides on Adding Links to WordPress

This article has provided you with a comprehensive guide on how to open external links in a new window in WordPress. If you’re interested in delving deeper into link management in WordPress, here are some additional resources you might find helpful:

Conclusion

Opening external links in a new window or tab is a simple yet powerful technique that can dramatically improve your WordPress website’s user experience and engagement. By following the methods outlined in this guide, you can ensure that visitors remain on your site, increasing the likelihood of conversions, subscriptions, and overall website success.

Remember, a seamless user experience is crucial for any website, and opening external links in a new window is a small but impactful step towards achieving that goal.

If you’re interested in learning more about tech news, feel free to visit my website: www.naveedahmed.me.

FAQs

What is the best way to open external links in a new window in WordPress?

The best method for opening external links in a new window in WordPress depends on your preferences and technical expertise. If you prefer a simple and straightforward approach, using the built-in feature in the block editor or classic editor is a good option. However, if you want to automate the process for all external links, using a plugin like Open External Links in a New Window or adding a code snippet with WPCode can be more efficient.

What are the security risks associated with opening external links in a new window?

The target="_blank" attribute can pose security risks if not used properly. The linked website could potentially gain access to your website’s context, leading to security vulnerabilities. To mitigate this risk, always use the rel="noopener" attribute alongside target="_blank". This attribute prevents the linked website from gaining access to your website’s context, enhancing your website’s security.

Should I open internal links in a new window?

It’s generally not recommended to open internal links (links to pages within your own website) in a new window. Internal links should typically open in the same window or tab to maintain a smooth user experience and prevent visitors from getting lost within your website’s content.

How can I ensure all external links open in a new window, even if I don’t manually set them?

You can achieve this using a plugin like Open External Links in a New Window or by adding a code snippet that automatically adds the target="_blank" attribute to all external links. This ensures that all external links open in a new window or tab regardless of whether you manually set the attribute.

What if I have a multi-author blog? How can I ensure all contributors follow this practice?

The best approach for multi-author blogs is to use a plugin or code snippet that automatically opens all external links in a new window. This eliminates the need for individual contributors to remember to manually set the ‘Open in new tab’ option. You can also create a style guide for contributors that clearly outlines this practice as a requirement.

Can I open specific links in a new window while others remain in the same window?

Yes, you can achieve this by manually setting the ‘Open in new tab’ option for specific links or by using a plugin that allows you to create custom rules for opening links in new windows. For example, you could create a rule to open all links from a particular domain in a new window while keeping other links in the same window.

Is it possible to open an external link in a new tab with a specific size and position?

Unfortunately, you cannot directly control the size and position of a new window opened by an external link using standard HTML attributes. However, you can use JavaScript code to open a new window with specific dimensions and position it on the screen. This method requires more advanced coding skills.

Does opening external links in a new window impact SEO?

While opening external links in a new window itself doesn’t directly affect SEO, using the rel="noopener" attribute alongside target="_blank" can improve your website’s security and potentially contribute to better SEO performance.

Are there any plugins that can open external links in a new window with additional features, such as tracking?

Yes, there are plugins available that offer advanced features for opening external links in a new window, such as tracking outbound link clicks. Some plugins can track link clicks, provide analytics, and even offer options for customizing the appearance of the new window.

Can I open external links in a new window based on certain conditions, like if a user is logged in or visiting a specific page?

Yes, you can use conditional logic and code snippets to open external links in a new window based on specific conditions. This requires more advanced coding knowledge and may involve using plugins that offer conditional logic or custom code execution capabilities.

I hope this comprehensive guide has provided you with valuable insights into how to open external links in a new window in WordPress. Remember, a seamless user experience is key to attracting and retaining visitors, and this simple technique can make a significant difference in your website’s success.

Posted in All by admin