Are there any issues when using Webflow where navigation items linked to home page sections no longer work when on other pages, and should they be linked with URLs instead?

Yes, anchor navigation to homepage sections can break when used from other pages in Webflow, because relative anchors only work on the same page. Here’s how to resolve it.

1. Understand the Problem

• When you link to an element on the same page using a #section-id, it works if you’re already on that same page.
• If your navigation link uses just #about and you click it from /contact, nothing will happen because /contact#about does not contain that section.

2. Use Full URLs for Navigation to Same-Page Sections from Other Pages

• From any other page, Webflow requires a full relative or absolute path to the homepage for anchors to work.
• Instead of #about, use /index.html#about or just /#about.
• Webflow will interpret /#about as a redirect to the homepage, then scroll to the element with ID about.

3. How to Update Links in Webflow

• Go to Navigation Menu in the Designer.
• Select each nav link that should scroll to a homepage section.
• In the Link Settings Panel, choose “URL” and enter /#your-section-id.
• Ensure there are no typos in the section IDs (case-sensitive and must match exactly).

4. Optional Best Practice for Section IDs

• Make sure section IDs are only used once per page.
• Use IDs like #services, #about, or #contact.

5. For One-Page Sites (Single Page Only)

• If your entire site is a single page, using #section-id is fine. No need to add / as a prefix.
• But if you’re navigating across multiple pages, always use /#section-id.

Summary

To link to homepage sections from other pages in Webflow, use /#section-id instead of just #section-id. Absolute or root-relative URLs ensure the link works properly site-wide.