How to create anchor links in WordPress manually
How to smooth scroll anchor links in WordPress
How to add anchor links in WordPress with a plugin

Today someone asked how to create anchor links in WordPress as I did on this post here.

These anchor links are also called jump links because they will bring you to a certain part of a page once you click on it, rather than scrolling up or down.

For example, you can try the following links and you will either jump to the end of this post or you will come straight to the video on another one.

If you want to achieve something like this, you have different options.

Either you create these jump links manually, or you use a plugin that will do it for you automatically.

 

How to create anchor links in WordPress manually

Step 1: Create Your Anchor Link

First, you want to locate the text that you want to hyperlink and highlight it. Then you click the button in your WordPress editor to add a link and paste in #yourid which needs to be a unique id preceded by a hash.

<a href=“#yourid">Your Hyperlink</a>

 

If you want to link to a different page, also an external page, and jump to a particular part there, you can use the following code:

<a href=“https://YOURURL/#yourid">Your Hyperlink</a>

 

Step 2: Create Your Destination

Now you need to find the part where you want to link to. Once you located it, switch to text view and add id=”yourid” to the HTML tag, like below:

<h2 id=“yourid”>Your Headline</h2>

 

If you don’t have an HTML tag where you want to jump to, you could simply insert the following tag which is unvisible.

<a id=“yourid”></a>Your text

 

The name attribute which was used before to achieve the same is not supported in HTML 5. So it should not be used anymore.

<a name=“yourid”></a>Your text

 

Step 3: Save

 

How to smooth scroll anchor links in WordPress

When using the above example, you might realize why anchor links are also called jump links, right?

Because they will instantly bring you to the desired part of the page. Yet, you might not like this and want to have your visitors a different, more smooth experience.

For this, you might want to have the anchor links smooth scroll to the part, rather than jumping there instantly.

You can achieve this with either using javascript or a WordPress plugin that will allow you to smooth scroll after clicking on an anchor link.

How to smooth scroll anchor links

Page scroll to id is one of the plugins I can recommend to use. It allows you to adjust the scrolling speed and offers more than 30 different easing types to make a smoother experience for your visitors when you create anchor links in WordPress.

 

How to add anchor links in WordPress with a plugin

Easy Table of Contents

The WordPress plugin that I used in the post mentioned above is Table of Contents Plus. Unfortunately, this plugin seems not to be supported anymore, as it hasn’t been updated in the last 4 years, and also the last comments on their homepage are from 2016.

create anchor links in wordpress - easy table of contents

So I recommend checking a different, but similar plugin called Easy Table of Contents. This plugin will create a table of contents from the headers within your post and is available for free on the WordPress plugin repository.

You can define what headings to consider to generate the table, or how many headings need to be present in a post in order to generate it in the plugin settings.

 

Advantage of having anchor links in your posts

There are some advantages to having anchor links your posts or pages. A few of them are:

▶️ Long blog posts
If you have longer blog posts, anchor links can help people to jump around the page easier, skipping content they aren’t interested in, and reading only what they were looking for.

▶️ Table of contents
Offering a table of contents at the beginning and/or the end of a blog post will help people to quickly navigate to a particular section of interest.

▶️ Sales pages to jump to the order section
On sales pages, jump links can be used to have people navigate to the order form while not reading the entire sales copy.

▶️ Return to top
At the end of a page, you might want to offer people to go back to the top as I did in the line below.

Return to top

Disadvantage of using anchor links in your posts

A disadvantage when offering anchor links in your post could be that your visitors will not stick that long around on your site. As they can quickly jump to the area of their interest, they might leave the page once they found what they were looking for.

 

 

Your Turn

Are you using anchor links in your WordPress posts? If so, how do you create them? Are you creating them manually or do you use a plugin? What do you think is the advantage of one or another? Let us know in the comments and discuss.

 

Leave a Reply

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.