Jump Links: How To Create Page Jumps Or “Anchor Links” In WordPress

Jump links or page jumps aka “anchor links” (I think it’s jump links) are when you click a phrase or word in the text and it takes you to somewhere else on the blog post or page. It can be a manual way to create a table of contents on your post.

[alert-note]

Since Gutenburg has become mainstream, this manual anchor link or jump link method shared in this blog post is now best for the classic editor.

To do it the new Gutenburg way (recommended if you’re using Gutenburg), this post from Kinsta nails it, plus gives other options including a Chrome Extension and a WordPress plugin to get it done.

[/alert-note]

The new Gutenburg way is WAYYYY better.

I love how it’s set up now. It’s the exact same concept as this method described here, but now Gutenburg sets you up for it. You just highlight the headline you want to jump down to, put the “Anchor link text” on the sidebar where it offers you to put it, then place the hashtag up top on whatever text you want to link to jump down to.

It’s the same method as taught here in this post, but even easier to accomplish.

So far, Gutenburg is a great advancement for WordPress in my opinion!

CLICK HERE TO AVOID RAMBLY INTRO >>>

I happen to write way too long of intros in my “top 10 +_____” posts or on the review blog posts, and for this reason, I use the anchor link or jump-link to offer them to jump straight to the list of whatever I’m reviewing or talking about.

The long information packed introductions and sections I always trap myself into writing before the product reviews.

These half the time end up being new posts or left on there and end up creating a massive Top 5 Best Natural Dog Foods post, for example.

[alert-note]

To make the terminology that much more confusing, I will use “page jump links” (combination of the two keywords, “page jump” and “jump links” into one: Page Jump Links).

[/alert-note]

---

Here’s a Youtube video of someone doing jump links live on video if you prefer. I need to start creating videos.

---

Some page builders help you do this by created modules that let you do it. Elementor has the anchor link section but I have yet to use it. This simple HTML way to do it is super easy after you do it once.

The blog I just executed the jump link on is a MyThemeShop theme (the Newspaper theme) – a perfect theme outside of the Generate Press theme to create simple and to-the-point blogs without all the fluff you see on many food blogs for example.

They may be called anchor links, but I think “Jump Links” is the latest official name. Let me share the method I learned from a WordPress tutorial blog post. If it’s not working for you, try putting a space before the sentence rather that right on the bracket triangle thing.

(used to say, “I will show you on this blog post itself“)

This is the destination text.

---

Page Jump Link Step By Step Instructions

To get going, first locate the phrase or word you want to anchor link or jump link.

For this post, the clickable phrase above that I’m jump linking is: “CLICK HERE TO AVOID THIS RAMBLY INTRO >>>”

To turn this into a page jump link, first I need to find where I want to jump link to. Can be a phrase or word.

Step by step instructions below include screenshots on each step of the process.

Page Jump Link Overview:

1. Go to the phrase or word at the top you’re turning into a jump link
2. Highlight it, link it with any hashtag, no spaces.
3. Then find where you want to jump link to
4. Highlight the phrase or word..
5. Click the TEXT side of this WordPress text editor, then put it inside the little jump link code snippet.

That’s it. The post preview should reveal it working or not.

---

Step 1. Write ANYTHING with a hashtag (no spaces) up above

As you can see here, I highlighted the text I want to “jump-link”

“CLICK HERE TO AVOID THIS RAMBLY INTRO>>>

I linked that text with a simple hashtag: #love-my-dogs

---

Step 2. Jump Link It With This Little Code Snippet:

<p id=“love-my-dogs”> DESTINATION TEXT HERE</p>

---

Step By Step Tutorial:

I highlight the place further down the post where I want to “jump link” to.

In this case, I want to jump link to the section where it says “Jump Link Step By Step Directions”

1. I can either jump link to the h2 headline itself
2. Or jump link the phrase right above it.

Highlight the phrase above the section you want to jump to, then go to the text html side of theWordpress text editor to place in the code snippet.

---

Step 3. Jump Link Code Snippet Placement

The first time I did it, it wasn’t working because I was using the hashtag still (<p id=”#love-my-dogs”>________</p>)

This was a simple mistake.

So when I deleted that hashtag, it worked.

The screenshot above shows it properly done.

I hit preview, it worked, and now I am a little bit smarter on WordPress:)

---

Conclusion: WordPress Jump Links

Ok so to add a bit more text to this short post, let me just go over the process again real quick in numbered jump link to-do steps:

1. highlight the text you want to hyperlink (the text that when people click, it jump links them down to wherever you want)
2. use the little <p id=”whateveryouwanthere-nospaces”>________</p>
3. The text inside the quotations are what you hashtag hyper link in the text up top (#whateveryouwanthere-nospaces)
4. The underline is just a placeholder I’m using, but this is where you place the text down below in your article you want to jump to.
5. Place that code snippet down below in the text editor side of the WordPress text editor
6. Preview and test to see if it works!

---

Final notes on the jump links in WordPress

• don’t put the hashtag on the bottom section you’re linking to – just quotes
• don’t put spaces, use hyphens or no spaces at all.
• You can jump link or anchor link headlines too.

UP NEXT: Avoid the wrong use of headline tags

---