How to get different navigation links for different pages on Squarespace 7.1?

Hey, so I finally figured out how to do same page navigation using code block anchor links and smooth scroll on my homepage. Right now, the navigation for "about" and "projects" all link to their respective anchor links on the homepage by linking to #about, #projects. But when I'm on any other page but my homepage, these navigation links don't work unless I specify the url slug and use /home#about, /home#projects - this would be fine except every time I click those links on my homepage, it doesn't smooth scroll down to the right section but will refresh the page first then scroll down. I don't want it to refresh when I'm already on the homepage but if I change it back to #about, #projects again, the links won't work on any other page.

To better understand my issue, you can click the "contact" link in my navigation menu (it currently uses /home#contact) and you will see that it refreshes the page first before scrolling down to it. Meanwhile "about" and "projects" are using #about and #projects only, which will work as intended on the homepage but not when you're on a different page e.g. https://www.saaniajamal.com/presentations.

Ideally, if I could just have different navigation links for the homepage and all other pages, this issue wouldn't even exist. But I've spent hours finding a solution and have reached a dead end. For the record, I am on the individual plan, not the business one so I can't mess with Javascript unless I upgrade. PLEASE SEND HELP SO MY PORTFOLIO CAN GO LIVE SOON.

6 hours ago, Saania said:

Hey, so I finally figured out how to do same page navigation using code block anchor links and smooth scroll on my homepage. Right now, the navigation for "about" and "projects" all link to their respective anchor links on the homepage by linking to #about, #projects. But when I'm on any other page but my homepage, these navigation links don't work unless I specify the url slug and use /home#about, /home#projects - this would be fine except every time I click those links on my homepage, it doesn't smooth scroll down to the right section but will refresh the page first then scroll down. I don't want it to refresh when I'm already on the homepage but if I change it back to #about, #projects again, the links won't work on any other page.

To better understand my issue, you can click the "contact" link in my navigation menu (it currently uses /home#contact) and you will see that it refreshes the page first before scrolling down to it. Meanwhile "about" and "projects" are using #about and #projects only, which will work as intended on the homepage but not when you're on a different page e.g. https://www.saaniajamal.com/presentations.

Ideally, if I could just have different navigation links for the homepage and all other pages, this issue wouldn't even exist. But I've spent hours finding a solution and have reached a dead end. For the record, I am on the individual plan, not the business one so I can't mess with Javascript unless I upgrade. PLEASE SEND HELP SO MY PORTFOLIO CAN GO LIVE SOON.

 

 

You can try the solution on this link: https://www.rebeccagracedesigns.com/blog/anchor-links-squarespace