How to add rel=”nofollow” to buttons in WordPress?

Since the Gutenberg system was introduced to WordPress users, it has turned very easy to create nice looking buttons to color up your system and get a higher click-through rate. To make things even better, you can even save your buttons and make them reusable, making them easier to implement in your different articles.

But, maybe you know that it is worth adding a rel=”nofollow” to your affiliate links if you write on such topics. So, is there a way to make links nofollow when you use the buttons and reusable buttons in WordPress since version 5.0?

I have been looking for a solution for a while, and after searching and working on it for a while, I found a solution. So, if you have a button or several buttons that you want to use, but you want to make the link a nofollow-link, this is what you need to do.

How to add nofollow attribute to WordPress buttons...

Make the buttons in WordPress 5.0 and later nofollow!

First of all, let us create a new button that is nofollow. As you create a new block, search for button, and add the button.

adding a button to the wordpress blog
I am adding a button as a layout element.

Once I have added the button, I add some text: “This is my test button”, and I add a link to Wikipedia.

A test button that will have rel nofollow in WordPress.
Here I am making the test button in WordPress that I want to be a nofollow button.

To turn this button into a rel=nofollow button, you will need to click the settings icon in the upper right corner and choose to edit it as HTML.

Time to manually add the rel nofollow instructions to the WordPress button
Now Edit the button as HTML.

You will then see the HTML yourself and you will have to add the following text to the button rel=”nofollow” after the link text. You can see how it is done in the example beneath.

Here you can see me manually adding the no-follow text to the button
I manually add the rel=”nofollow” text to the WordPress button.

Now the job is done, and you just have to press the preview screen. It might not look the way it should, but as you save the article/draft and take a look at the results, you will see that it is working as it should. Now you can also add this to your reusable blocks and it will be easy to find and use in the future, and you will not have to manually add the rel=”nofollow” text every single time to the same block in the future.

Take a look at the block we have just created together right here…

How can I find out if my WordPress button really is a nofollow link?

That is really easy. You can open the article or page in your browser in which you have added the WordPress button with the nofollow link. Then you right click your mouse and click the “View Page Source” option.

Once you have selected this option, search inside the source (can often be done by clicking CTRL+F). Search for the text on your button, and once you have found it, check the link to see that the nofollow relation has really been added to your button.

The proof showing that nofollow relation has been added to the wordpress button
I am checking the source of this article, and there you can see that the nofollow attribute has really been added to the button.

There you have it, this is how you can add the nofollow attribution to your WordPress buttons. I really enjoy using the buttons and they are so easy and quick to make and even easier to use again once you have saved them and made them reusable.

Why is it important to add nofollow to buttons?

Not all buttons need to have a nofollow attribute, and the link in this article to Wikipedia definitely doesn’t need one. But, if you are working with affiliate marketing your site might be considered a spammy as you link to affiliate partners, and that is why it is so important to add the nofollow relationship to the links pointing in the direction of your affiliate partners.

Are you good to go?

I hope these instructions will help you out. If you need any help making your WordPress buttons nofollow, write a comment and I will do my best to help you out!

One thought on “How to add rel=”nofollow” to buttons in WordPress?

Leave a Reply