Connecting Back to Anchor on other Page Issue

  • Hello, I have a WordPress site and there are multiple sections on the homepage.

    When you are on the homepage, and click on “About us” in the navigation, it scrolls down to the about us section (On the Homepage, same page). If the URL is https://www.testsite.com, and I click on “About us”, the URL stays https://www.testsite.com. I did this by linking the “About us” navigation link to #about.

    The issue I’m having is when I go to another page on my website, and try to click on “About us” again it doesn’t work. For example, when I’m on the contact us page (www.testsite.com/contact) and click on “About us”, the URL changes to (www.testsite.com/contact#about). I don’t have a URL (www.testsite.com/contact#about).

    I’m not too sure how I can connect back to the section from the homepage on another page. I’m using Elementor.

Viewing 3 replies - 1 through 3 (of 3 total)

  • Using just #about makes it relative to whichever page you’re on. That’s why this gets added to the contact page’s URL. This is how HTML and browsers work, and not something endemic to WordPress.

    If you need the anchor link to work across different pages, you’ll need to add the full URL, not just the anchor part. So use https://www.testsite.com/#about, instead of just #about

    Good luck!

    Thread Starter buddystudyhall

    (@buddystudyhall)

    @gappiah I used #about as a CSS ID. I’m using Elementor, and it won’t let me create the anchor as a web link only as a CSS ID.

    I used #about as a CSS ID. I’m using Elementor, and it won’t let me create the anchor as a web link only as a CSS ID.

    The CSS ID is just the anchor point or the reference to the section of the page that you want to jump to. But you’ve created a LINK somewhere that people must click on to jump to this anchor point, perhaps in your main menu. It is the URL used in this link that I was referring to.

    Let’s say on your page have a headline “About Moneky Training School” and you assigned it the CSS ID, the code will look like this under the hood:

    <h2 id="about">About Moneky Training School</h2>

    But in your menu, you have a link labelled ABOUT. While creating this menu item, you must have used the URL #about. This makes it relative to the current page that is active, and will only work if the current page also has an anchor point named “about”.

    If you want the ABOUT link which goes to the “about” anchor on your homepage to work irrespective of which page you’re on, then you need to use https://www.testsite.com/#about for the MENU item’s URL, and not just the #about you used.

    I hope it’s clearer to you now.

    If this still doesn’t address your issue, kindly give your website address so I can check the code and give you specific advice.

    And if you’re unable to give your address, I’ll please ask that you ask your question in Elementor plugin’s own forum, so you’ll get help from the developers and other users savvy users of the plugin: https://www.ads-software.com/support/plugin/elementor/

    Good luck!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Connecting Back to Anchor on other Page Issue’ is closed to new replies.