How can I link to a section in another page in Webflow? The solution suggested in another post did not work for me. Any ideas?
TL;DR
- Assign a unique ID to the target section on the desired page.
- Link using the relative path plus the ID (e.g.,
/about#pricing), apply it in the link settings, publish the site, and test the link works.
To link to a section in another page in Webflow, you must create a full URL that includes both the page path and the section ID (anchor). Here's how to do it properly:
1. Identify the Section ID on the Target Page
- Go to the Page where the section you want to link to exists.
- Select the section element (e.g., a div block).
- In the Element Settings Panel, give it a unique ID (e.g.,
features). - Make sure it's not just a class—an ID is required for anchor links to work.
2. Construct the Correct URL
- Use the format:
yourpage.html#sectionID - Example: If the target is the "Pricing" section on the About page and its ID is
pricing, and the page slug isabout, use:
/about#pricing - This works for both internal and external links.
3. Use That Link in a Button or Link Block
- Select the Button or Link Block you want to use.
- In the Link Settings Panel, choose URL.
- Enter the full relative path including the
#ID, like
/about#pricing
4. Publish and Test
- Publish your site, since anchor links may not work in preview mode when linking across pages.
- Visit the page containing your link and click it—it should scroll to the correct section on the target page.
5. If It’s Not Working, Check These
- Ensure the ID matches exactly (no spaces or typos).
- Section ID should not begin with a number, as this can cause issues.
- Do not rely on preview mode—cross-page anchors require a browser refresh or opening a new page to work.
Summary
To link to a section on another page in Webflow, assign an ID to the target section, then link using the relative path and anchor (e.g., /services#features). Be sure to publish the site and double-check the spelling of your IDs and slugs.