Section links or anchor links allow you to link to specific sections in a webpage. To create an anchor link, you'll first need to set an element ID on that section.

In this lesson

Step 1 — Setting the element ID

You can assign an ID to any select element in the Settings panel (D).

Assign an ID to the selected element
Assign an ID to an element
Good to know
  • An element ID should be unique for each element.
  • An ID must contain at least one character and cannot contain any space characters.
  • An element ID can also be used in custom code to point to a style in a style sheet or to manipulate a specific element with JavaScript. However, the most come use for an ID is in section links or anchor links to different sections on a page.

Step 2 — Configuring the link

  1. Select the link element that you want to take you to a section on your page.
  2. In the Settings panel, select the Section ID from the Page section dropdown menu.
Link to a section on a page

Linking to a section on another page

If you want to link a button, for example, to a section on another page:

  1. Select the button and choose the external link option in the Link Settings
  2. Enter the URL for the desired page followed by `#` and the ID you assigned to that section i.e. yoursite.com/page#Element-ID
    or if your page is nested in a folder: yoursite.com/folder/page#Element-ID
Link to a section on another page

Examples

On this page, we have 3 section links that link to the 3 article sections on this page.

  1. Setting the element ID
  2. Configuring the section link
  3. Linking to a section on another page

To link to this last section of the page, the URL is: https://university.webflow.com/article/anchor-links#linking-to-a-section-on-another-page