Creating Anchor Links in WordPress

When you have a page with a lot of content, such as an FAQ page or a how-to guide, it can be hard for visitors to find what they’re looking for. For better or worse, skimming is the new norm in online reading. If you overwhelm viewers with long blocks of text, they may simply leave.

Fortunately, it’s easy to break pages down into discrete chunks by using anchor links. These are links that enable readers to go straight to a specific part of the page. You can use this feature to list out a set of topics and let visitors jump to whichever one they’re interested in. Using anchor links correctly can even help to boost your Search Engine Optimization (SEO).

On this page, we’ll explain what anchor links are and how to apply them on your WordPress site. Let’s jump right in!

What Are Anchor Links?

Anchor links (also known as “jump links”) are links that take you to a specific section of either the page you’re already on, or an external page. It’s very likely that you’ve used anchor links many times. They may have come in handy when you needed to navigate a table of contents in a Wikipedia article, for example, or jump to a particular section on an FAQ page.

Tips for Adding Anchor Links

Anchor links are simple in principle, but there are a few things you’ll want to keep in mind when using them on your own website. These include:

• Transitions. Unless you specify a transition effect, anchor links will quickly jump the reader down to the appropriate part of the page. This can have an unpleasant result if the page moves too quickly. It’s easy to add a transition effect using a WordPress plugin such as Page Scroll to ID, or by adjusting your jump links’ CSS.
• ‘Return to top’ links. Once a user has jumped down to the location indicated by the anchor text, they’ll have to scroll all the way back up to the top if they want to visit another section. Therefore, it’s smart to include a ‘return to top’ link at the end of each section for easy navigation.
• Using anchor links appropriately. Anchor links aren’t always necessary. For example, if you’re writing a long article with multiple chapters, it may be better to break it into separate pages (using a table of contents plugin) than to use anchor links on an endless scroll.

To expand on that last point, anchor links are best suited to content that’s relatively short, and where each reader may only be interested in a specific section. FAQs, reference articles, troubleshooting guides, and similar types of content are perfectly suited to anchor links.

How to Manually Create Anchor Links in WordPress

There are a few ways to create anchor links in WordPress. The two most common options are to add them manually, and to use a plugin. Let’s explore the manual approach first.

Step 1: Choose Your Link’s Text and Assign It an Anchor Name

To get started, you’ll want to add the text for your anchor link to your page or post. Then, select it and click on the link icon from among the formatting options, just as you would to add a link normally. Instead of linking the text to a URL, post, or page, however, you will assign it an ‘anchor name’:

In the window that opens up, instead of pasting in external link, you’ll create a name for the link. This can be anything you like, although it’s best to keep it short and relate it to the section the link will point to. In addition, make sure you preface your anchor name with a hashtag (#), as in the example above.

Step 2: Add Your Anchor Name to the Relevant Section of Your Page or Post

Next, you’ll need to indicate which section of your page or post your anchor link should lead to. Navigate to that section, and access the HTML editor by selecting More Options > Edit as HTML:

Then, add the ID you created earlier to the content’s initial tag. If you’re linking to a specific paragraph, for example, you would include the ID in its starting <p> tag, like this: <p id=”about”>.

It’s important that the ID you add here exactly matches the ID you used for your link. As long as that’s the case, readers will be jumped to the section you chose when they click on the anchor link.

How to Create Anchor Links in WordPress With a Plugin

As with so many things, creating anchor links is made much easier in WordPress with the right plugin. There are a few options, but let’s look at how to do this using the popular Page Scroll to ID plugin.

Step 1: Add a Shortcode Block to Your Page or Post

First, you’ll want to install and activate the plugin. Then open up your page or post, and add a Shortcode block wherever you want your anchor link to jump to:

Then, enter the following into the Shortcode block:

[ps2id id='section-1'/]

You’ll want to replace “section-1” with whatever anchor name you’d like to use. For more details on using and modifying this shortcode, you can check out the plugin’s detailed documentation.

Step 2: Create an Anchor Link

Next, you can insert your anchor link. Again, you’ll do this by creating a Shortcode block, and placing it wherever you’d like your link to be located.

You’ll paste this shortcode into the new block:

[ps2id url='#some-id']link text[/ps2id]

You should replace “some-id” with the anchor name you created above, and “link text” with whatever anchor text you’d like the link to have. Then save your changes, and your anchor link will be ready to go!

Learn More With WP Engine

Anchor links aren’t hard to use, but they can take a little practice to get right. If you’re feeling stuck or need help adding them to your site, don’t be afraid to reach out.

Here at WP Engine, we offer top resources for developers and make it easy to create an incredible digital experience for your customers. Check out our plans to learn more about WP Engine’s world-class WordPress hosting today!