[edited] Navbar links lead to 404 pages

Hi, I’m pretty sure I’m missing something really basic here. I’ve been trying to test the links in my navbar symbol in the preview mode and they are all going to 404 pages. Link to test project: https://preview.webflow.com/preview/navbar-test-as?utm_medium=preview_link&utm_source=designer&utm_content=navbar-test-as&preview=494902ba195c97f6935610433427639d&workflow=preview

Only links to sections on the same page work. What doesn’t work is when I try to link to a section on a different page, or a different page altogether.

I’m following the steps outline in this page: Section link | Webflow University

From one of the inner pages, when I try to link to a section on let’s say, the Home page, I specify “/Home#section-name” in the url. What this does is take me to “https://webflow.com/Home#section-name”.
(I tried publishing the page and the way to link back to a section on the home page from one of the inner pages was to simply add the published url before the #, and not ‘Home’)

How should I go about testing the navigation in the preview mode? Thanks!

This is a case of relative links.

“/Home#section-name”
Takes you to that link relative to webflow.com

If you want the links you specify to be relative to your own domain, all you need to do is add a period at the beginning of the link

“./Home#section-name”

This should work fine.

Thank you @bavshehata Unfortunately, this still doesn’t work :frowning:

I’m using the navbar as a symbol, and currently only the link back to the Home page works, links to the other inner pages don’t work, even though I’m not manually specifying the url and just using the page drop-down in Webflow’s UI

Here’s a link to my sample project: https://preview.webflow.com/preview/navbar-test-as?utm_medium=preview_link&utm_source=designer&utm_content=navbar-test-as&preview=494902ba195c97f6935610433427639d&workflow=preview

Hello Aswin,

I believe there’s a problem with links being linked with a navbar. However, here is one very simple solution since these links will be consistent (ie. you won’t need to change them from one page to another)

1- Unlink the ‘Link’ field
image

2- Use the default linking method
image

This should work fine now. Also, one more tip. When you want to link to certain sections inside your page, instead of typing manually ‘#section-id’, you can use the section option while directing the link

Hope this answers your question! If it does, please like it and mark the reply as the answer so that you can help keep the community tidy.

1 Like

Thank you very much @bavshehata! That unlink solution saves me a lot of time.

Your suggestion for linking to sections works great, but only when the sections are on the same page. If the sections are on the homepage, then this navbar would be fully functional only on the home page itself and not in any other page where I directly want to jump back to this section.

The only other solution I’ve come across so far is this: How to adjust navbar linking on different pages

— Looks like I can only link to sections from other pages by using actual urls after publishing the site. Any suggestions or alternative approaches?