There are several different methods for making external links on your WordPress site open in new tabs or windows when users click on them.
Whether or not it is recommended practice is up for debate, but a common reason that you might want to do it is so that users can click on links without leaving your website. This can be especially useful if your post refers to multiple products side-by-side, for example. Or, if you’re writing a how-to guide that points to external resources as part of the process, users can click on those links, gets the files or information they need, and not lose their place in the guide.
These methods are baked into WordPress itself and don’t require any plugins or apps. They’re most convenient for individual links rather than sitewide behavior.
Using the Gutenberg Block Editor to Open Links in New Tab
If you’re writing and editing using the Gutenberg block editor (the standard editor in new recent versions of WordPress), when you go to add or edit a link, there’s a simple switch that lets you choose whether the link should open in a new tab or not.
This is useful for individual links, but it only applies to that specific link. And it applies to whatever link you assign it to–it can be an external or an internal link.
Using the Visual Editor / WordPress Class Editor to Open Links in New Tab
The Visual Editor is the older WYSIWYG editor in WordPress. It has been replaced with Gutenberg Block Editor in more recent versions of WordPress. 1
The Visual Editor also has the built-in option to open a link in a new tab. To find it, add a link using the chainlink icon from the editor toolbar.
Then click on the small cog/gear icon just to the right of the URL.
That will add a popup window. I’m only including the top part here, because that’s where the relevant setting is, but you’ll see a checkbox for “Open link in a new tab.”
Again, this is useful for individual links, but it only applies to that specific link. It applies to whatever link you assign it to–it can be an external or an internal link.
Note that this isn’t limited strictly to the Visual Editor, as such. It actually works across the Classic Editor, which includes both the Visual Editor and Text Editor. If you switch to the Text Editor tab, you can still use this functionality by using the
link button from the editor toolbar.
Using HTML Code to Open Links in New Tab
If you’re writing links manually, you can add the target attribute to the link. To open the link in a new window or tab, use this:
So the full code for a link might look something like this:
<a href="https://wordpress.org/plugins/classic-editor/" target="_blank" rel="noopener">html/text editor</a>
This is also a useful option to have if you want to adjust one or two links on a page. Switch to the HTML editor and insert the code in the relevant link.
Plugins to Open Links in New Tab
There are several plugins that can automatically add the
_blank attribute on the fly as the page opens. These are especially useful if you want to apply the change across a whole site. And they can often add other link attributes, such as
The best I’ve come across that still works with recent versions of WordPress and is updated regularly is WP External Links by WebFactory Ltd. It’s free.
You can use it to open external links in new tabs, but you can also do quite a lot more with external links. Nofollow and sponsored are useful for SEO. Noopener and noreferrer are useful for security. And you can also work with internal links, add exclusions, and several other useful features.
These are best used for sitewide applications. It is possible, though, to exclude links from it (as well as selecting just external or even just internal links).
It is technically possible to apply this behavior sitewide by adding code to your theme’s functions.php file. While I’ve come across a few different iterations, I haven’t found one that I’m confident enough in to include here. But a good WordPress developer should be able to code one for you that doesn’t conflict with other things on your site.
The core (i.e., original) version of Markdown, or its common variants such as MultiMarkdown, don’t include provision for link attributes such as the target attribute. In those cases, the best options are to replace the markdown links with standard HTML links or to use one of the plugin options that modifies the links on the fly as the page is rendered in the browser.
- It’s possible to restore the older version and not use the Gutenberg Editor (which is what I do). Plugins like Classic Editor have this functionality.
- These are “rel” attributes rather than “target” attributes, but they can still be applied using this plugin.