How to Add Nofollow Links in WordPress Block Editor (Gutenberg) – WordPress has a new Editor called the Gutenberg Editor which has many great features which will allow you to easily create beautiful posts and pages.
Gutenberg Editor’s features have helped many people use WordPress more efficiently. Although many users still rely on the classic editor, there are many who have switched to this new editor and don’t want to go back to using the classic editor. Because many users recognize that Gutenberg Editor is an excellent editor tool.
But there’s one thing Gutenberg can’t do. That is not allowing you to directly add links or nofollow links. In Gutenberg, you have to add the nofollow tag manually.
You might think you can use that nifty old nofollow plugin, which is that it can add a nofollow tag by simply checking the nofollow option when adding a URL or link. But, unfortunately it doesn’t work with the new Gutenberg block editor.
To solve this in this article, I will show you how to add a nofollow link in the WordPress Gutenberg block editor. Because of course many WordPress users need nofollow links in their content.
What are Nofollow Links?
Nofollow is the value of the rel attribute set on the link to tell search engines not to follow the link. And nofollow links are links marked with rel = “nofollow”.
To understand what nofollow links are, you first need to understand what a hyperlink tag looks like in HTML.
Here’s an example:
<a href=”https://www.verandalounge.co.uk"> Tutorial WordPress</a>
This is an example of a dofollow link. By default, all links are dofollow links.
If I wanted to make the link a nofollow link, it would look like this:
<a href=”https://www.verandalounge.co.uk" rel="nofollow"> Tutorial WordPress</a>
So nofollow is the attribute rel value of a link. The link attribute given the Nofollow rel will tell the search engine bots not to follow the link. That means that the search engines will regard the links as unrelated.
When do you need to add a WordPress nofollow tag?
So, when should you add nofollow tag to your links or links?
By default, all links in WordPress have a dofollow tag. In this way, search engines can crawl and also index the linked pages.
Whenever you have a dofollow link pointing from your website, you are basically passing the link to your website juice.
This is a good practice and makes your website more trustworthy for search engines. But what if you don’t want the link juice to be passed on to another website?
In such cases, nofollow links are useful. There are many instances when you provide a link to a page where passing link juice is not a good idea.
Here are three types of links that you should nofollow:
- Sponsored Links: Anytime you add sponsored links to your website, it’s a good idea not to follow them. Since the link is already sponsored, removing your valuable link juice should be avoided.
- Affiliate Links: Whenever adding affiliate links to your page, always use the nofollow tag.
- Untrusted Links: Sometimes you have to link to certain websites that may not be trusted. In such a case, you have to use the nofollow tag.
Now, let’s see how you can add nofollow links in the Gutenberg Editor.
How to Add Nofollow Links in WordPress (Gutenberg)
In the Gutenberg editor, adding nofollow links is done manually. Here’s how you can add or create any link on Gutenberg as a nofollow.
In your editor, highlight or block the text you want to add the nofollow link to.
Now, click the chain link icon and enter your link.
I just added a link to the text I wanted. Let’s make this link nofollow.
Click on link settings and check the “Open New Tab” option. This is not strictly necessary but is a common and good way for your external links.
Now, click on the three dots “Block Settings” icon and select ‘Edit as HTML’. This will show the HTML block.
You will be able to see the hyperlink tag along with the link you added. Within this tag, you will see that the rel tag has been added with the values ’noreferrer’ and ‘noopener’.
In this “rel” tag, add a nofollow value as shown below.
And now you have successfully added a nofollow link to your website.
Every time you want to add a nofollow link, you have to edit the block in HTML and add a “nofollow” value in the “rel” attribute. You don’t need to change anything in the hyperlink tag.
Adding nofollow links or links in the Gutenberg Editor can be a little tricky because a lot of things have to be done manually, especially when you have to add lots of nofollow links in one article.
I believe this tutorial will help you to easily add nofollow links in Gutenberg. If you have any questions about the tutorial, please leave a comment below and I hope this article was of use to you and good luck. 🙂