How To Use Anchor Links in WordPress Posts and Pages?

An important factor to consider when you’re making blogs is that its easy to consume for your viewers. This includes adding images, videos, illustrations and more whenever necessary. Moreover, an important part to consider when you’re blogging, especially for long blogs is navigation. You need to ensure going through various points in your blogs isn’t cumbersome and adding anchor links on your posts can go a long way in improving the quality of your blogs. This way users can easily navigate directly to any section of the blog to either skim through the content and focus on what they really need from your blogs.

An anchor link is simply a type of link on your page that links to various other content on the same webpage. It is an essential thing to have in longer WordPress posts with tons of various subheadings and sections. Add in a little table of contents on the top of your post with anchor links to various subsections and your post already looks, extra professional.

Why do we need Anchor Links in WordPress Posts and Pages

The idea behind using anchor links and a table of content is to let users simply choose what content to view. They can easily select the section of the post that they want to go through, skip through anything else and start from a point that they’re more comfortable with.

So why wouldn’t you want nifty anchor links on your WordPress posts? They’re even good for SEO as your anchor links will show up on your Google search results too! Add in a few nifty anchor links on your subheadings and Google will provide direct links to your anchor tags straight from your Google search results.

So now that we’ve made clear about the advantages of using Anchor links in WordPress, let’s take a look at how you can enable them in WordPress posts and pages.

How to add Anchor links in WordPress without using plugins:

In order to add Anchor links in WordPress posts, you need to use hyperlinks using the WordPress editor. Simply take the text that you change into an anchor and add a link to it using the Insert link button. Then, you can add your anchor link by using ‘#’ as the prefix, followed by the slug text or the anchor link ID that you want to use.

For example, we have this demo text that says Anchor text. We simply highlight it and click on the link button that asks us the required link source. Instead of giving it an HTML link, we’ll give it an anchor link ID. For this, you need to use ‘#’ prefix. For this demo, we’ll use ‘#anchor_text’ in our link.

Using Anchor ID Attribute to links

Next, you take the text that you want the link to jump to. For this demo, we’ll be using a Heading with text ‘Anchor text.’

Then, click on the extended options button on the toolbar and click on the edit as HTML option.

From here, we’ll take our HTML tag in the code and add an id attribute to it with the slug text of our anchor ID. Remember that you need to add this ID on the HTML tag without the ‘#’ prefix. For example, we take our HTML tag which can be <h1> , <h2>, <p> and so on. Next, we add the ID attribute as:

<h3 id= “anchor_link”> Anchor Text</h3>

Then, WordPress will ask you the prompt to convert the block into HTML, so go ahead and click on ‘Convert to HTML.’

Now, if you follow these steps correctly, you should have a functioning anchor link setup on your heading or paragraph text.

How to use Anchor links in WordPress to make Table of Contents:

So let’s go ahead and create an entire Table of contents using a bunch of anchor links.

Now, we’ll set up an entire list with 4 different links. Each has different anchor links listed by serials. So, we’ll have 4 Headings with links: ‘anchor-link1’,’anchor-link2’ and so on.

Then, we place multiple Headings that relate to each link in the form of ‘Heading1’ and ‘Heading2’ and so on.

Next, we place the ID attribute on their text to correspond to each Anchor links. It should show up something like this.

Then, we add the appropriate Headings below. Similar to the process above, we place the ID attribute on the HTML tags of the Headings to set up our anchor links.

Once that’s done, it should look something like this:

Concluding:

And now, you’re ready to start using Anchor Links in WordPress posts and pages with ease. Remember to keep your articles easier to read with the necessary links to multiple subsections or even consider using your table of contents. Moreover, if you need to learn about more ways of making your WordPress blogs easier to read we have a few other articles for you to explore.

• How to Add Audio to WordPress: A Beginner’s Guide
• Beginner’s guide to create Affiliate links on your WordPress website?
• How to Display Code Snippets in WordPress Posts? Step-by-step guide!