When & How to Use Noopener Noreferrer in WordPress

It’s pretty common for WordPress users to take a closer look at their page’s HTML from time to time. If you do that, you may notice rel="noreferrer noopener" on some links. So, what exactly is noopener noreferrer?

In short, it’s a small but important security measure for links that open in a new tab or window. It works together with the target="_blank" attribute to keep your site safe and private. Let’s see how it works and when WordPress adds it automatically.

Make a Link Open in a New Tab

When you make a link open in a new tab in WordPress, the underlying HTML looks like this:

<a href="http://example.com" target="_blank" rel="noopener noreferrer">Example.com is cool</a>
Code language: HTML, XML (xml)

That rel="noopener noreferrer" part is what we’re talking about here.

If this looks like technical gibberish, don’t worry. WordPress handles it for you. You just need to toggle one simple setting in the editor.

Here’s how to do it:

1. Create a link as usual in the WordPress block editor.
2. Click the link in the editor to open the link options menu.
3. Turn on the toggle labeled “Open in new tab.”

When that option is on, WordPress automatically includes the correct HTML behind the scenes — including the noopener noreferrer attributes.

What noopener and noreferrer Actually Do

• noopener prevents the new tab from gaining access to the original page through a property called window.opener. This stops a potential security issue known as tab-nabbing, where a newly opened page could manipulate the page that opened it.
• noreferrer prevents browsers from sending referrer information to the new page. This means the site you’re linking to won’t see your URL as the traffic source.

Together, these attributes make external links safer for your visitors and for your website.

Do You Need to Add These Manually?

No. WordPress automatically adds rel="noopener noreferrer" whenever you set a link to open in a new tab. Most modern browsers also apply similar protections, but it’s still best practice to include these attributes explicitly.

When You Might Skip noreferrer

The noreferrer part hides referral information, which means the site you’re linking to won’t see where visitors came from. This usually isn’t a big deal, but if you rely on referral tracking. For example, when using affiliate links or analyzing outbound traffic, you may want to keep noopener but remove noreferrer.

Internal vs External Links

These attributes are mainly important for external links (those that point to other websites). For links within your own site, the security risk is minimal, and it’s fine to omit them if you prefer.

SEO and Analytics

noopener and noreferrer don’t affect SEO or how search engines treat your links. They also don’t influence your site’s link authority. The only impact is that noreferrer hides referral data in analytics tools.

If you want to control how search engines follow a link, that’s where rel="nofollow" or rel="sponsored" come in — not noopener or noreferrer.

Quick Reference

Bottom Line

You don’t need to manually add noopener noreferrer in WordPress, the editor already takes care of it. Still, it’s useful to know what those attributes do and why they appear in your HTML.

For external links that open in a new tab, using rel="noopener noreferrer" remains the safest and most reliable practice.