WordPress Anchor Links: Easy Manual & Automatic Setup

WordPress anchor links are great for users and search engines. They make it easier for people to navigate your content, which keeps them on your WordPress site longer. When reading a long article or a help guide, you may find it difficult to reach the exact section you want. This is where anchor links help. An anchor link takes you directly to a specific section on the same page. You don’t need to scroll through everything – click and you are there.

For website SEO, anchor links help Google understand your content better and may even appear in search results (meaning they get highlighted in featured snippets). This can bring more clicks to your page.

This guide shows you how to add anchor links in WordPress posts and pages. We’ll start by explaining anchor links, when to use them, and how to add them using 3 different methods.

KEY TAKEAWAYS

• Anchor links help users jump to specific sections on the same page without scrolling manually.
• You can add anchor links manually using the WordPress Block Editor or basic HTML.
• Use a plugin like AIOSEO to add a table of contents with automatic anchor links.
• WordPress anchor links improve user experience and boost SEO by simplifying exploring pages.
• Always test your links to ensure they scroll correctly and aren’t blocked by sticky headers.
• Combining anchor links with internal links can increase page views and keep users on your site longer.

What is an Anchor Link?

An anchor link is a special link that lets you jump to a specific part of a page. Instead of sending you to a different page, it scrolls you down to a section on the same page. This makes it faster for visitors to find what they’re looking for.

WordPress anchor links are helpful on pages with a lot of content. They organize things and make the page easy to explore without scrolling too much.

You’ve probably seen anchor links working on pages with a table of contents. For example, when you click on Step 3: Add Pages in a list, the page scrolls down to that specific section. That’s an anchor link at work. It connects the clickable text at the top with the matching section lower on the page.

Here’s how it works behind the scenes:

Every anchor link points to an HTML element (tag) on the page with a unique ID. When someone clicks the link, the browser looks for that ID and scrolls to it. This is done using simple HTML, the link may look like #step-3-add-pages, and the target section would have an ID like:

id="step-3-add-pages"

Why & When to Use WordPress Anchor Links?

Anchor links help people move around your content quickly. Visitors may not want to scroll through everything if your page is long. However, with anchor links, users can click once and go straight to the part they want. This makes your page easier to use and more helpful.

These links also give your site a better chance to stand out in Google. Sometimes, search engines show anchor links below your page title in search results. This lets users skip directly to a section they’re interested in, which can lead to more people visiting your WordPress website.

You’ll find anchor links useful on how-to articles, detailed tutorials, or pages that answer many questions. If someone only wants a particular section or one question from an FAQ, anchor links let them jump to that spot immediately.

You might have noted that using WordPress anchor links keeps your site clean, organized, and user-friendly. It shows your readers that you care about their time and want them to find answers quickly.

How to Manually Add WordPress Anchor Links

In this section, we explore 3 simple ways to learn how to create an anchor link in WordPress. Whether you’re using the Block Editor, Classic Editor, or working directly with HTML, these methods will help you guide your visitors to the right section of your content quickly and smoothly.

The first method uses the Block Editor (Gutenberg), the default editor in modern versions of WordPress. It allows you to add anchor IDs to heading blocks without touching code. This method is beginner-friendly and perfect if you prefer using WordPress’s visual tools.

The second method is for those using the Classic Editor, either by choice or through a plugin. While it doesn’t offer a built-in anchor feature, you can still add anchor links by switching to the HTML view and manually inserting the required ID and link. It’s slightly more hands-on but still easy to follow.

The third method involves writing the anchor link and ID using HTML. This approach gives you full control and is helpful when editing theme files or building custom layouts. It’s great for users who are comfortable working with raw HTML.

Let’s begin with the first method using the Block Editor and walk through each step in detail.

Use Block Editor (Gutenberg)

Adding anchor links in the WordPress Block Editor (Gutenberg) is simple and doesn’t require extra tools. You create a link that scrolls to a certain part of the page, then give that target block a matching name, called an ID. Here’s how to do it step by step:

Go to Posts → All Posts (or Pages → All Pages to add an anchor link in a page). Hover over your post and click Edit to open it in the WordPress editor.

Click on the block you want to jump to; this is usually a heading. Under the Block tab in the right sidebar, scroll to Advanced settings. Find the HTML ANCHOR field. Enter a short, unique anchor name (no spaces, use hyphens if necessary), for example, price-section and heading1-1.

Note that WordPress automatically adds id=”heading1-1″ to that heading.

Next, create the link that will jump to the anchor. To do that:

Go to the text or button you want people to click. Highlight it, then click the link icon (chain symbol). In the link box, type a # followed by the anchor ID you added earlier. For instance, if your ID is faq-section, type #faq-section. Then, press Enter or click Submit to save the link.

After saving or updating the page, click the anchor link to see if it scrolls to the correct spot. If it doesn’t, double-check that the link and the anchor ID match exactly.

Tips for Choosing Anchor Names:

Keep them short and clear. Use words that describe the section. Don’t use capital letters or spaces. Stick with lowercase and dashes if needed (product-details instead of Product Details). Also, ensure each ID is unique on the page. Using the same ID in two places will confuse the browser.

Use HTML to Add WordPress Anchor Links

If you’re comfortable working with code, add anchor links using HTML. This gives you full control over where the link points and how it behaves. It’s helpful when adding links inside custom layouts, theme files, or if you prefer writing clean HTML by hand.

Here’s how to add WordPress anchor links using this method:

Pick the spot you want users to navigate to. This could be a heading, a paragraph, or even a <div>. Then, add an id attribute to that HTML tag. For example:

<h2 id="heading1-1">Heading1.1</h2>

Here, “heading1-1” is the unique name or anchor ID. It tells the browser where to scroll when someone clicks the link.

Then, write the clickable link that leads to that section:

<a href="#heading1-1">Heading 1.1</a>

The href=”#heading1-1″ part connects the link to the element with the id=”heading1-1″. When clicked, it scrolls directly to that spot.

This method is a great option if:

• You’re adding anchor links inside a theme file or a Custom HTML WordPress block.
• You want more control over how the code is structured.
• You’re not using the WordPress editor but are writing your content manually instead.

This method isn’t hard to learn, and it’s useful when you want to keep things lightweight or code without depending on the visual editor. Ensure the href and id match exactly, or the link won’t work.

How to Automatically Add Headings as Anchor Links in WordPress (Recommended)

Use a plugin to add WordPress anchor links automatically to save time and avoid manual work. A great option is the All in One SEO (AIOSEO) plugin. It includes a built-in Table of Contents block that turns your headings into clickable links.

This method is easy, fast, and works well even if you’re uncomfortable with code. It also keeps your content clean and helps readers explore long posts without getting lost.

We’re using this plugin in our example because it can handle the technical work for us. It automatically finds your headings and adds anchor links to them. It creates a clickable list (table of contents) that links to each section and updates the links if you change your headings later.

It makes your content more user-friendly and helps search engines understand the layout of your page. Here’s how to achieve this automation:

First, install and activate the AIOSEO plugin. Next, open the post or page where you want to add anchor links. Type /table of contents and select the AIOSEO – Table of Contents block.

The plugin will scan your content and list all headings (like H2 and H3).

You can change the block’s title, such as Quick Links. To do that, select the AIOSEO – Table of Contents block, click on the three-dot menu in the toolbar menu, select Rename, provide a name of your choice, and click Save.

This new name will appear under Block.

You can also choose which heading levels to include. If you wish to hide a heading from the list, click the eye icon next to it. You can also change the style, for instance, to make the list look like a bullet point list or a numbered list.

If you’re using the premium version of AIOSEO, you can also reorder headers. Once done with the customizations, save your post or page.

After that, open your page or post in a new tab. Click the links, and the page should scroll smoothly to the right section. If necessary, return and adjust the block settings.

Note: If you’re using a plugin to manage WordPress anchor links or a table of contents and it’s not working, it could be because of a theme conflict or a cache issue. To fix this, try switching to a default WordPress theme to check for conflicts. Clear your site’s cache and browser cache to ensure you see the latest version of the page. Deactivate other plugins one by one to see if something else is interfering.

How Anchor Links Work in WordPress

Anchor links work by connecting 2 parts of the same page:

1. The clickable link.
2. The section it leads to.

They use simple HTML, and the browser does the rest. To make an anchor link work, you need 2 things:

1. The Target Section with an ID: This is where the link will scroll to. You add a special name, called an ID, to the section. For example:

<div id="section-name">

This tells the browser that this is the place you want to jump to.

2. The Clickable Anchor Link: This is the part someone clicks. It uses the same ID with a # symbol in the link:

<a href="#section-name">Go to Section</a>

When one clicks the link, the browser scrolls down to the section with that matching ID.

You may be thinking about the scroll behavior of WordPress anchor links. Remember, these links don’t reload the page. They don’t take the user to a new page; instead, the browser scrolls smoothly to the target section on that same page. This makes the page feel faster and easier to use.

Combine WordPress Anchor Links with Internal Links for Better SEO

Internal links connect one web page on your WordPress website to another. They help visitors explore more content and guide search engines through your website. When done correctly, internal linking can improve your site’s structure and help your pages rank better in search results.

Anchor links can make your internal linking even more powerful. Instead of just linking to a page, you can link directly to a specific section on that page. This gives users quick access to the exact part they need, which makes your content more useful and easier to navigate.

For example, instead of linking to a full article, you can point visitors straight to the FAQs section of that article using a link like:

https://yoursite.com/product-guide/#faqs

This saves time and helps users and search engines understand your content better.

Best Practices for Using WordPress Anchor Links with Internal Links

When using WordPress anchor links with internal links, follow these best practices. Start by keeping your anchor IDs short and clear. Each ID should describe the section it leads to, making it easier for search engines and users to understand what to expect.

Ensure you link to valuable sections, like answers to common questions or key steps in a tutorial. Instead of pointing to the same section time and again, spread your anchor links across different parts of your content. This gives users a fuller view of your page and helps search engines see the depth of your content.

Always double-check that the section you’re linking to exists and includes the correct anchor ID. If the ID is missing or there is a typo, the link won’t work properly. Also, place your links where they naturally belong within the content. Avoid forcing them into areas where they may confuse readers or disrupt the flow.

Combining anchor links with internal linking improves how users move through your website and helps search engines crawl your pages more effectively. It’s a simple but smart strategy that boosts user experience and SEO performance.

FAQS

Other Related Tutorials

– How To Add Featured Posts In WordPress: 6 Easy Ways

– How To Clear Cache In WordPress: 5 Quick Methods

– How To Remove Query Strings From Static Resources In WordPress

– How To Increase Maximum Upload File Size In WordPress

– How To Create A WordPress Sticky Header: 4 Easy Ways