-1

In my header navigation, I would like a menu tab to direct the user to open a page and directly take them to an anchored point in that page. Does any one know how I can accomplish this in WordPress?

Thanks!

2 Answers 2

1

Add this page link in navigation menu with #target_point, example http://example.com/contact#location_map

Then add an anchor at somewhere of that page with name="location_map". Something like <a name="location_map"></a>

Now when someone clicks on this menu, he'll be directed to this specific part of contact page.

2
  • This is great, I am having trouble with adding the #target_point to the navigation menu. I have added my page URL but the page doesn't load at the anchored point. I see the anchor on the visual part of the page, so that is entered correctly. Any suggestions of what could be wrong?
    – Corey
    Apr 7, 2015 at 13:40
  • Add Links instead. Example: tinyurl.com/o5mm5o8
    – mukto90
    Apr 7, 2015 at 14:41
0

If you only seek to direct users instantly to the anchor point, you'd use mukto90's solution. However if you want the user to arrive at a page and then have it automatically scroll to the anchor point, you'll need to add SmoothScroll jQuery as well:

$('a[href^="#"]').on('click', function(event) {
    var target = $(this.href);
    if( target.length ) {
        event.preventDefault();
        $('html, body').animate({
            scrollTop: target.offset().top
        }, 1000);
    }
});

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.