In this tutorial, I will teach you how to add a “nofollow” attribute on the links in a navigation menu.
Why Would You “Nofollow” A Link Anyway?
Adding a rel=”nofollow” attribute to a link is mainly done for SEO purposes, as it tells Google and other search engine crawlers that you don’t want to pass the “link juice” to a certain url; but in addition to this, as per Google’s policy, links should also be nofollowed if it falls on any of the following:
- You are linking to an untrusted content
- You are linking to paid links
- You want to prioritize other links
Some other reasons that you need to add a rel=”nofollow” attribute
- You are linking to an affiliate link (which you really should nofollow)
- You are just selfish and you don’t want to pass the link juice to external sites
Adding the rel=”nofollow” attribute
Adding this attribute to a link is really easy for ordinary links (page and post links). You just need to follow the sample code below:
<a href="http://www.url.com/some-pages/" rel="nofollow">Anchor Text</a>
But the million dollar question is this – how about if you want to add this attribute to a link in a navigation menu?
There is actually a way to do it, and that is what I will be showing you below:
Step 1: Go to ‘Appearance > Menus’
Step 2: Enable ‘Link Relationship (XFN)’
You can find this option on the ‘Screen Options’ on the upper right corner of your WordPress Menu Page. Just click on the arrow to reveal the options then locate the ‘Link Relationship (XFN)’ option and check the box beside it
Step 3: Add the “nofollow” Attribute
On your Menu Structure, select the item that you want to nofollow and click the arrow on the right to reveal the configuration options. locate the ‘Link Relationship (XFN)’ then enter “nofollow” on the field. (refer to the image below). Click ‘Save Menu’ once you’re done.
And that’s it! Your chosen links on the navigation menus are now nofollowed.
How To Check
To check if you have done it correctly go to a browser and enter your website url on the address bar. Once your site has loaded, if you are using firefox, use right click then select ‘Inspect Element’
Once the app has loaded, click on the ‘pick an element from a page’ (see image for reference)
Then click on a page element that you want to check. In this example, I tried to nofollow my “About Page” so I will click on that
Once you clicked on that element, the properties will be shown, and as you can see from the image above, there is a nofollow attribute in the link, which verifies that we have successfully nofollowed our desired navigation menu link.
Now that you already now how to do it, why not try it on your own WordPress blog as well. Just follow the steps above so you won’t be lost in the process.
If you think that this tutorial helped you, you can show your appreciation by sharing this post, and if ever you have some questions, don’t hesitate to contact us or you can just comment below