Wordpress links with anchors to a different page

[aaron4osu]

I built a Wordpress theme where it’s basically a one page layout except for the blog pages. So all the links except for the news (blog page) have anchors to id’s on the home page. This works fine when on the home page, but when you go to the News (blog) page or any of of the blog posts the nav links with anchors do not work. When I inspect the links they look as expected: domain.com#reservations.

If I copy and past the domain into a browser it works fine as well. Just not on click?

HOWEVER… when I hover over the link and can see the status bar the browsers seem to be adding a / (forward slash) between the domain and the anchor. domain.com/#reservations???

any ideas???

and I’m using the normal id=“anchorName” for the sections I’m linking to.

<section id="reservations" >```

this is how wordpress is outputting in onto the page which looks fine as well:

• Cafe

	<li id="menu-item-85" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-home menu-item-85"><a href="https://domain.com#club">SUPPER CLUB</a></li>
	
	<li id="menu-item-86" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-home menu-item-86"><a href="https://domain.com#reservations">RESERVATIONS</a></li>

	<li id="menu-item-88" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-home menu-item-88"><a href="https://domain.com#contact">INFO</a></li>

	<li id="menu-item-83" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-55 current_page_item current_page_parent menu-item-83"><a href="https://domain.com/news/" aria-current="page">The News</a></li>
</ul>

```

[Gandalf]

Assuming your home page is index.php, have you tried
http://domain.com/index.php#reservations
?

[aaron4osu]

I hadn’t but I just tried and that doesn’t work either. If I copy and paste the link yes it will, but not when I click on it. weird.

[Gandalf]

Could it be your browser? Can you try a different one?

[aaron4osu]

just figured it out. I had some javascript for smooth scrolling that was messing with the a tags. I moved this script to only run on the home page and that fixed the issue…

Thanks for the help.

<script>
$(document).ready(function(){
  // Add smooth scrolling to all links
  $("a").on('click', function(event) {

    // Make sure this.hash has a value before overriding default behavior
    if (this.hash !== "") {
      // Prevent default anchor click behavior
      event.preventDefault();

      // Store hash
      var hash = this.hash;

      // Using jQuery's animate() method to add smooth page scroll
      // The optional number (800) specifies the number of milliseconds it takes to scroll to the specified area
      $('html, body').animate({
        scrollTop: $(hash).offset().top
      }, 800, function(){

        // Add hash (#) to URL when done scrolling (default click behavior)
        window.location.hash = hash;
      });
    } // End if
  });
});
</script>