NoFollow Link WordPress Tutorial: Text + Image Links

Learn to create Wordpress nofollow links in posts for both text and images, by easily tweaking the HTML code in Gutenberg blocks.

*Disclaimer: This post may contain affiliate or referral links, which means if you make a purchase I may receive a small commission or “store credit” for referring you :)

Add NoFollow Links to Text + Images in WordPress Gutenberg

When the Gutenberg editor first came out, I wrote a long post about my frustrations with editing links and attempts to figure out solutions. Since then I’ve become rather fond of Gutenberg, and have a solid handle on creating nofollow links, which I do rather frequently!

Since most who read my first post seemed to be looking for answers on how to create nofollow links in Gutenberg, I decided to make this separate post as a condensed guide to creating nofollow links in Gutenberg — both text and image links.

So with that, let’s get on with the tutorial.

Adding NoFollow Links to Text with the WordPress Gutenberg Editor

  1. Add some text that you want to make into a link. This could be in a text block, heading block, list block, etc.
  2. To add a link, select the text with your cursor and click the chain-link icon. Add a URL and click the arrow directly to the right of the URL to apply it to your text. By default, the link will be dofollow and will open in the same tab.
  3. To make the link open in a new tab, click the drop-down arrow to the right of the URL to open the link settings. Then toggle the Open in New Tab button.
  4. To make the link nofollow, you’ll need to manually edit the HTML code. Thankfully, Gutenberg’s blocks make this process easier than with the classic editor, because you don’t have to scan an entire page of code to find the part you want to edit! To do this, click on the block with the link to select it, and click the icon with 3 stacked dots to open More Options. Select Edit as HTML. Assuming you’ve already set your link to open in a new tab, you’ll want to find the link, followed by target=”_blank” (code that make the link open in a new tab)

Adding Nofollow Links to Images with the Gutenberg Editor

  1. Add an image block.
  2. Click on the image and find the image settings in the right sidebar of the Gutenberg editor. Scroll down to the link settings of the image.
  3. To add a link, click the drop-down to add a media file, attachment page or custom URL. By default, the link will be dofollow.
  4. Toggle the Open in New Tab button, and you’ll notice the Link Rel box below populates with “noreferrer noopener.”
  5. In most cases, you won’t want to keep the “noreferrer” tag (especially if the link is a referral or affiliate link), but the noopener tag is fine and adds a layer of security. So you’ll want to replace “noferrer” with “nofollow,” then save the entire post to update.

Keep Reading...

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top