This article will show you how to create anchor links in WordPress.
Anchor links (or jump links) will take you to a specific section on the page you’re on, or a specific section on a different page.
Using anchor links in your blog posts is not only going to be great for user experience, but also great for SEO. More on that in a bit.
Look at this blog post, for example, the table of the content above is sets of anchor links. Each link will take you to a different part of this article without you scrolling into it.
When To Use Anchor Links
Anchor links in WordPress are extremely useful when you have pages or blog posts with a lot of content.
After writing a blog post, you may want to divide the content into sections and create anchor links. Each of the links in that table of content will navigate the user to the relevant section of the post.
Again, I refer you to the table of content of this specific blog post. Scroll to the top of this post and you’ll see the table of content under the first paragraph. Each of the links there is an anchor link. If you’ll click on one of the links there, it will take you to that section of the blog post.
Another reason and common use for anchor links are in the website menu. Many WordPress websites are very minimal and contain only a few pages. Some websites prefer to display all the information on the home page without navigating to other pages. Those websites can have a menu with anchor links to the different page sections.
Why Use Anchor Links
There are a few reasons why to use anchor links. The first reason is to make the navigation for your readers easier.
Think about it, in today’s world. Our attention is minimal, and we lose focus quickly. This study shows that a website visitor will leave your site within a few seconds after they entered.
If a visitor entered one of your longest posts, he may leave immediately because he couldn’t find the relevant information that he was looking for. That quick turnaround will sky jump your bounce rate and will impact your SEO.
With anchor links like the table of content at the beginning of the post, the visitor can go through the links and jump to the relevant section.
Anchor links can also help you with SEO. How so? When your blog posts contain anchor links, Google and other search engines will rank you over your competitors that don’t have them. Besides, it will also display your anchor links in the search results.
Google is all about user experience. When providing anchor links, you signal Google what the sections of the article are. Google will pick it up and will provide the quick access links to that article.
Let’s take the search query ‘What is Paleo diet’ for example. When searching for it on Google, the first few results will contain anchor links to those specific sections in the article. Google prioritizes the websites with the anchor links over the websites without it.
From a visitor’s point of view, this is very good for me. I can click on the link to the relevant section of the article without going through the whole article.
How to Create Anchor Links
Creating anchor links in WordPress is a fairly easy process. What you need to know and remember is that anchor links coming in pairs.
What do I mean by that? There are two components to anchor links, the link itself, and the section that the link is referring to.
On a page or a post
To create anchor links in WordPress you’ll need to navigate to the edit screen of the page or the blog post where you want to create the desired anchor link.
From inside the WordPress editor, highlight the word or the phrase that you’ll like to use as the link, and click on the link icon.
Here you’ll name the link with a hashtag at the beginning. You can name it anything you want just make sure it makes sense (for Google). Also, you can use dashes but not spaces.
In our example. I named the link #What-Is-The-Best-Star-Wars-Movie
Next, we will need to decide which section this link is referring to. Scroll to the relevant section of the article. After you found it, hover your mouse on it and click on the three dots icon and then click on ‘Edit as HTML’.
When editing the block as HTML, you’ll be able to access the tag of the block. Some of them will be
h6 which means heading elements and some will be
p tags which meaning paragraphs.
All that left to do is to add
id=“the-same-name-of-the-link” to the opening tag (without the hashtag). If we will use our example again, the link named was ‘#What-Is-The-Best-Star-Wars-Movie’ so what I’ll add to the tag will be id=“What-Is-The-Best-Star-Wars-Movie”. Please note that it is case-sensitive.
After doing so, update the page and test the anchor link. If it was made right, clicking on the anchor link will take you to the relevant section on the same page.
To make it even better, read our article and learn how to change link color in WordPress.
In the menu
I’m sure that you ran into some websites that had anchor links in their header menu. As you already know, anchor links are easy to create.
In this section, I’ll show you how to create anchor links in the WordPress menu.
As I showed you above, to create an anchor link, all you have to do is to name the link as you wish and add a hashtag before the name. That will navigate you to the relevant section on the same page.
But, if you are on PAGE A and you want to create an anchor link to a specific section on PAGE B, use the full link of PAGE B along with the anchor link.
Now that we know how to create anchor links between pages, let’s see how we can create them in the WordPress menu.
First, navigate to the section that you would like to set as the anchor section and give it an ID as I showed you above.
Second, from your WordPress dashboard, navigate to Appearance -> Menus.
On the left side, click on Custom Links and enter the full page URL of the section above with the anchor link. for example
https://www.example.com/#anchor-text-link. Next, enter a link text.
Click Add To Menu and then on Save Menu.
Now, go back to your website and click on the new link in the menu. If you’re on the same page where the anchor section is, you’ll jump right into the section. If you are on a different page, it will take you to the right page and the specific section.
Make sure to watch the short video below if you have any questions or something wasn’t clear enough.
Now you know what are anchor links in WordPress and why they are important.
If you have any questions or comments please let us know in the comment box down below.