WordPress is the popular content management system for creating your content. Though the Gutenberg block editor is easy to use, sometime things can be difficult to find. Good example is to create a hyperlink in WordPress. It is easy to insert a link, however, many users do not know how to add additional parameters like rel=nofollow to hyperlinks. In this article we will explain how to add rel=nofollow attribute to links in WordPress.
What is Rel=Nofollow Attribute?
The entire internet works based on the links from one website to another site. Without external links connecting to other sites, both users and search engines will not be able to discover useful sites on their own. In fact, having links from high authority domains is one of the most important factors of Google search algorithm to rank a page top in search result.
However, there are situations you want to link a page but do not know the page is legitimate or not. In such a situation, you can add nofollow attribute to the link to inform search engines that you do not want the crawlers to follow the linked page. Search engines like Google and Bing will ignore the nofollow links and do not consider it while calculating the ranking. This is a win-win situation for you to connect the page at the same time not giving your domain authority to some unknown webpage.
HTML Link – rel=”nofollow”
In HTML, a hyperlink has the following syntax. When a user clicks on the anchor text “Linked Page”, it will open the page “https://site.com/page1/”
<a href="https://site.com/page1/">Linked Page</a>As mentioned, search engine crawlers will follow the linked page “https://site.com/page1/” and consider this link when calculating the ranking of the linked page. To avoid that you can add nofollow attribute as below:
<a rel="nofollow" href="https://site.com/page1/">Linked Page</a>Add rel=”nofollow” to Links in WordPress
Since it is possible to link text and images in WordPress, we will explain adding nofollow in text and image links.
Add Nofollow to Text Links
First, select the text and click on the link icon from the too bar that appears on the block. Alternatively, you can select the text and press “Command + K” in Mac or “Control + K” in Windows computers to insert a hyperlink in WordPress.
After that, enter or paste your external webpage URL, in our case we just enter https://wikipedia.com/ as an example. Now, select “Search engines should ignore this link (mark as nofollow)” option and click the submit icon.
That’s all!!! Now, you have added nofollow attribute to your text link.
Add Nofollow to Image Links
The process is same for adding nofollow attribute in image links. After selecting an image, click on the “Insert Link” icon from the tool bar. Remember to select the image and not the “Add caption” or the caption of the image which will add a text link only to the caption.
It will open a text box where you can type the external page link and click on the small arrow mark at the right end. On the drop down that appears, enter nofollow in “Link Rel” text box and click the submit icon.
Testing Nofollow in Links
There are two ways to check whether the inserted link has a rel=”nofollow” attribute or not.
Checking HTML of the Block
This is an easy option as you can do it right from the Gutenberg editor. Click on the “Options” icon showing as three vertical dots on the block’s top toolbar. Select, “Edit as HTML” option to convert the text or image block to HTML source code.
You can see the HTML hyperlink syntax with rel="nofollow" attribute is inserted to the anchor text.
Checking Webpage Source Code
Next option is to check the source code of the webpage. The difference in this method is that you can check the page’s code on a browser without logging into your WordPress admin dashboard. Right click on your anchor text or the linked image and select “Inspect” option. On some browsers like Safari on Mac, you need to select “Inspect Element” option.
This will open the developer tools where you can see the hyperlink has rel=”nofollow” attribute.
