Bitcatcha's content is reader-supported. When you purchase through links on our site, we may earn an affiliate commission. Learn more

How to Create Anchor Links In WordPress (And Improve Navigation)

WRITTEN BY
Jao Gavino
UPDATED
May 25, 2024

 

Anchor links are a great way to make your website more user-friendly.

 

These links serve as ways for your readers to quickly zip through your articles, helping them find the information that they’re looking for near-instantly.

 

It’s also a big part of improving your SEO (search engine optimization), letting you target specific keywords that you want to rank for in Google’s search results.

 

If you’re wondering how to add these helpful little links to your WordPress articles, then look no further!

 

 

What Exactly Are Anchor Links?

 

what are anchor links

Anchor links are like bookmarks for the most important sections of an article.

 

Anchor links are hyperlinks that you can use to link to specific parts of a web page, sort of like an interactive table of contents.

 

These links are usually located at the start of articles or web pages, helping readers navigate to the parts of the article or page that is most relevant to them.

 

anchor links sample

Anchor links (highlighted in red) serve as a table of contents for a post or article, helping your readers jump to whichever sections they want.

 

 

What Are Anchor Links Used For?

 

But what would you use these links for?

 

1. Anchor links help your readers navigate your articles quickly

 

Databox, a cloud-based business analytics platform, wrote in 2021 that experts from various fields aim for around 2,000 words for a standard blog to improve its SEO.

 

That’s a lot of words, especially given that, according to a report from Newsweek, people only focus their attention on something for 47 seconds on average. As such, setting up links are especially useful for people who just want to get to the point.

 

And that’s where anchor links come in: As we’ve stated above, they give your readers a quick overview of your article’s contents and allow them to get the information that they want from your article in the least amount of time.

 

2. Anchor links help with SEO indirectly

 

In addition, anchor links are particularly useful for indirectly helping your site’s search engine rankings. Consider this search result:

 

rich results from anchor links

Anchor links helped create this search engine result, allowing users to immediately see the information that is pertinent to them.

 

Such results are known as rich snippets and are based on an article’s table of contents, which in turn contain anchor links. Anchor links help provide context to search engines and their users’ queries, letting them immediately see the information that they’re searching for at a glance.

 

Never underestimate the power of the reader’s experience. Even if you sign up with the best web hosts and have the world’s fastest website, if your visitors can’t find the information that they’re looking for, believe us, they’ll just leave and find that information elsewhere.

 

However, if they can quickly see the information that they’re searching for via these rich snippets, they may be more likely to click on the result that leads to your site, in turn increasing your site’s SEO ranking.

 

3. Anchor links help with your site’s bounce rate

 

Your site’s bounce rate refers to the percentage of its visitors who leave without engaging with your content, be it clicking a link, leaving a comment, or making a purchase.

 

Put yourself in your reader’s shoes:

 

For example, if you’re searching for a way to fix an annoying, high-pitched metallic pinging noise that your car’s engine has been making for the past week, you’re not going to read through 14 other problems that aren’t related to that one specific noise.

 

Instead, you’re just going to click on the anchor link that takes you to that problem directly, and then fix it yourself or call a mechanic.

 

If you run into a site with no anchor links, you’d probably just click off of it and find another site that answers your problem within a few seconds and doesn’t waste your time.

 

With anchor links, you can easily just set up a way for readers to jump to a specific type of engine noise, reducing your site’s bounce rate. You can gradually build a following of happy, loyal readers by not only answering their questions but also giving a link that leads directly to those answers.

 

 

Are there any drawbacks to having anchor links?

 

To be completely honest, there aren’t really a lot of disadvantages to using anchor links. But, here are some things to be wary of:

 

Firstly, anchor links aren’t always useful.

 

For example, if you’re just going to write a short, 200-word site update to inform your readers that you’ll be on vacation for a week or so, there’s not really much of a point in adding anchor links. If your readers can see the entirety of your post without scrolling down, you don’t really need to use anchor links.

 

Second, anchor links could decrease the time that visitors spend on your site, which could negatively affect your ad revenue. If they just skip to specific sections, this may reduce the number of clicks that you get for your ads.

 

However, this second disadvantage isn’t exactly a disadvantage. If you make your visitors happy by answering and solving their questions, they may sign up for your newsletter or make a purchase (if you’re selling any products).

 

Remember: your readers are your site’s lifeblood, and keeping them happy (and keeping them around) may be more important than your ad revenue. Carefully balance the pros and cons—a happy reader may spend more money on your site than what you get for ad clicks!

 

 

Two Easy Ways to Create Anchor Links in WordPress

 

plugins to create anchor links

Plugins are just one of the ways that you can add anchor links to a WordPress article.

 

1. Adding anchor links using WordPress

 

If you’ve signed up with a reliable hosting provider, such as Hostinger, you may have a simple WordPress site already set up. To add anchor links to your site manually (without actually manually coding everything in HTML), you’re going to have to use WordPress’s own tools.

 

Luckily, WordPress’s post editor lets us set up anchor links easily with very minimal HTML coding needed.

 

Simply create a new post, and type out your post as needed. In this sample post, we’ll have 4 different sections. To add sections to your article, simply click on the “Add block” icon in the editing interface, and then click on “Heading.”

 

add block

Click on the “Add block” icon (1), and then click on “Heading” (2).

 

Once you have enough subsections, it’s now time to add a table of contents to your post. We’ll be using bullets for our table of contents, so type out a section title below, say, your introduction text, highlight it, and then click on the “Paragraph” button.

 

edit paragraph

Highlight your section title (1), and then click on the “Paragraph” button (2).

 

In the small menu that pops up, click on “List.”

 

add list

Clicking on the “List” will show a preview of your text once it gets changed into a list (2).

 

Type out your list of sections, and then highlight a bulleted item (“Section 1” in this case). In the small menu that pops up, click on the “Link” button. In the other popup, type out a section URL preceded by a pound sign (#) (“#section-1” in this example).

 

hashtag link

Highlight a section of bulleted text (1), click on the “Link” button (2), and then type in a section name with a “#” symbol before it.

 

Do this with your other bulleted items, and take note of the section URLs that you use (the text with the pounds signs before them). If you forget any of these URLs, you can simply click on the hyperlinks that you’ve set up to review them.

 

edit hyperlink

You can also click on the pen icon (3) to edit your URLs if you see any errors.

 

What we’ve done here is set up a bunch of anchor links that point to non-existent sections (e.g., #section-1, #section-2, and so on) in the HTML of our article. Now, we need to give the section titles these HTML names—think of it as giving them their own little addresses for the anchor links to follow.

 

To do this, we’re going to have to do a very small amount of HTML coding. Click on any of the section headers that you’ve created, then click on the “Options” button, and then click on “Edit as HTML” in the menu that pops up.

 

edit as html

Click on the section header (1) and then on the “Options” button (2). Then, click on “Edit as HTML” (3).

 

Once you’ve done this, the section header will change from regular text to HTML code. In the code preceding the section name (i.e., the h3 section), add the following code after adding a space after h3:

 

id=”section-title

 

Change section-title to the section URLs that you used for the table of contents. In this case, you’ll change the code for the “Section 1” header into the following:

 

edit visually

Add the line of code and change the section title to the URLs that you’ve set up in your table of contents (1). Then, click on “Edit visually” (2) to exit the HTML editing view.

 

Do the same for your other section titles, and name them accordingly in the code (e.g., section-2 for the second section, and so on). Once you’ve done this, publish the post, and test out your anchor links!

 

test out anchor links

Test out the links in your article as needed, and troubleshoot them as necessary!

 

2. Using plugins to add anchor links

 

Alternatively, you could also just use a WordPress plugin to automatically add anchor links to your posts. In this example, we’ll be using the Easy Table of Contents plugin, so go ahead and install and activate that plugin.

 

Once you’ve done this, navigate to “Settings” and click on “Table of Contents.”

 

toc setting

Hover your mouse over “Settings” (1) and then click on “Table of Contents” (2).

 

Adjust your settings accordingly in the panel that appears. For example, this plugin automatically inserts a table of contents (TOC) for all of your posts and pages, but you may want to enable them for other post types as well (or disable them for specific post types).

 

edit toc

You can change the post types that the plugin will automatically add a TOC to (1), the position of the TOC (2), how many headers are required before a TOC is automatically added (3), and whether the TOC will have a header of its own as well as the text that shows for that header (4).

 

All of the settings for this plugin are self-explanatory, and you can tweak even the style of the table of contents as much as you want. Fiddle around with the settings as you please, and click on “Save Changes” once you’re done.

 

Once you’ve done all of this, go ahead and create a new post to test out the plugin. Add in enough headers, and publish your post!

 

complete toc

If you’ve set up everything correctly, you’ll see a table of contents like this in your published article!

 

Now that you’ve set all of this up and everything’s working like you want it to, congratulations! You’ll (probably) never have to worry about manually coding in a table of contents to your posts ever again!

 

If you enjoyed this quick and easy plugin tutorial and would like to learn more WordPress tips and tricks, check out our list of the best e-commerce plugins!

 

 

Anchors Aweigh!

 

Now that you understand what anchor links are and how you can use them for your website, you’ll be able to easily direct your readers to specific parts of an article and capitalize on all of the benefits that it brings.

 

Keep in mind our tips for when and where to use anchor links, use our recommended methods for adding these links, and your site will surely be one step further toward being a user- and SEO-friendly paradise!

 

Lastly, if you’re just getting started on your website-creating journey—or if you’re a veteran looking to switch—here are our top picks for the best managed WordPress hosts!