How To Create On Page Anchor Navigation Links

Updated: July 2, 2018
Filed Under:


If you are looking for how to create a link to jump to a specific part of a page, then this is the post for you. Depending on what tools you use on your website, there are several ways you can do this.

My prefered way is to create them in my page builder, Elementor. But here is a manual way to create them.

1. Name the Target Area

Choose the exact spot you want to send your link to, choose and element near it (a div, header tag, paragraph.. whatever as long as it's in the right spot), add id=”something”, you can call them anything you like as long as the names are the same in the link and the target ID and preferably no spaces (spaces change to %20 in the address bar and look a tad messy).

An example would look like this: <div id=”pricing-table”>The content of your div here.</div>

2. Link To Your Anchor Target Area

To link to your anchor simply use: <a href=”#pricing-table”>Link Text Here</a>
or if it's on another page: <a href=”pagename#pricing-table”>Link Text Here</a>

Adam @ WPCrafter

My passion is making the best quality video tutorial online, for non-techies. When I am not behind the camera, I am usually helping out one of my YouTube subscribers.

How To Make A Website 2019


Best WordPress Hosts 2019


InMotion Hosting

50% Discount Offer


Free Course Offer

WordPress Starter Course

10 thoughts on “How To Create On Page Anchor Navigation Links”

    1. Adam @ WPCrafter

      It’s pretty much the same thing, you just need to find where in a section you can add the ID for that section.

  1. Hi, Is there a way to position the anchor an offset higher or lower than where it actually? Adding gap?

  2. Hi Adam,

    May I ask if we can use anchor link to open another page under the same page name? Example, someone click on the elementor button and it opens to another page for the description but I want the page name to appear the same. At present, although my permalink sets to post name but it still comes out with wp-admin…%… like that instead of the page name. Thank you.

  3. Adam, maybe I am not understanding this correctly. I followed your video but in trying to link two words of text in a paragraph on a different page from the anchor all I get is “page cannot be found”. I am using Elementor. can you please help.

  4. Adam, can you please do a tutorial for Pods plugin and Elementor 2.0 … Precisely on how to create a template for a new post type (NOT the existing default post types).

Leave a Comment

Your email address will not be published. Required fields are marked *