SOLVED: Why WordPress Links Are Now Noopener Noreferrer & How To Easily Fix It

URTech.ca does a lot of WordPress work including running our own sites and recently and advertiser mentioned that his links were set to not provide the referring website details. To be more specific, the HTML was:

<a href="https://www.businessinsider.com/personal-finance/proof-of-stake-vs-proof-of-work" data-type="link" data-id="https://www.businessinsider.com/personal-finance/proof-of-stake-vs-proof-of-work" target="_blank" rel="noreferrer noopener">Proof of Work (PoW) or Proof of Stake</a> 

Note that for privacy reasons, the page and link we are using in our examples is NOT our advertisers’. This is just a sample of a real page on our site

What is rel=”noreferrer noopener”

noreferrer noopener is common HTML code that stops the destination sites analytics from knowing which site someone came from.

Mozilla puts it this way”

“noreferrer keyword… instructs the browser, when navigating to the target resource, to omit the Referer header and otherwise leak no referrer information

“[noopener] instructs the browser to navigate to the target resource without granting the new browsing context access to the document that opened it. […] This is especially useful when opening untrusted links, in order to ensure they cannot tamper with the originating document…”

https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel/noreferrer
https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types/noopener

How To Avoid rel=”noreferrer noopener” In WordPress

noreferrer noopener He is only present on links that are configured to open in a new browser tab. So if you need referrer information to be passed on to the destination, simply don’t set your WordPress links to open links in a different tab.

The screenshot on the right shows you how to not use OPEN IN A NEW TAB in WordPress.

IMPORTANT NOTE: The catch that we have found at least with the current version of WordPress in the fall of 2023, is that once you have added a link with the open it in a new tab check box, removing the check box does not remove noreferrer noopener. We found that we had to remove the link altogether and then re add the link otherwise the HTML would not change.

Going forward we will have nearly all of our links open in the existing tab, just to avoid this problem, which is not what we wanted but that’s the world we live in.

Why Have rel=”noreferrer noopener” in WordPress?

Our research showed that WordPress had changed the code as a security measure three years ago and we were surprised to find that none of our other advertisers had mentioned it.

According to WordPress, this change was brought in because it is possible for scripts to intercept the new tab code and cause problems. In other words this is a security feature that you’re probably not going to want to get around.