Studio Editor: Adding and Using Anchors

Anchors allow you to link directly to an element, making it even easier to highlight and direct visitors to important content on your client's site. When you add an anchor, you can link to it in a few ways:

• Link elements: Link elements (e.g. buttons, text, etc.) to an anchor. When visitors click the element, they're directed to the anchor.

• Display them in an anchor menu: Display anchors in a dedicated menu to let visitors navigate around a page.

• Display them in a regular site menu: Add anchor links as items to the site menu, so visitors can access them from any page.

Adding an anchor

Add an anchor to sections, containers, and elements. We recommend giving your anchor a unique name so it's easy for you to find in your editor.

To add an anchor:

1. Click the element you want to add an anchor to.

2. Click the Open Inspector icon

   

   at the top right of the editor.

   

3. Click the Anchor drop-down.

4. Enable the Add an anchor toggle.

5. Enter the anchor name into the field.

Note:

It is not possible to add an anchor to global sections, or elements attached to global sections.

Adding an anchor menu

Display anchors in a floating menu that is always visible - even when visitors scroll. Anchor menus give site visitors the option to access the content they need, no matter where they are on the page.

Good to know:

Anchor menus are particularly useful on one-page sites that are very long, with several sections.

To add an anchor menu:

1. Click Add Elements

   

   on the left side of the editor.

2. Select Menu & Search.

3. Click Anchor Menus.

4. Click the menu you want to add it, or drag it to the relevant location on the page.

Have a multi-page site?

Add your anchor menu to a global section to display it on multiple / all site pages.

Managing and customizing an anchor menu

Manage the anchor menu to display the items you want. You can also customize the menu's design to complement the site's look and branding.

To manage and customize an anchor menu:

1. Click the anchor menu in your editor.

2. Choose what you want to do:

   • Manage the anchor menu: Select Manage Menu and make the changes you want:

   • Add and remove anchors: Select / unselect the checkboxes to choose which anchors are displayed in the menu.

   • Rename items: Click the relevant anchor in the panel, and enter the new name.

   • Customize the menu:

     1. Click the Open Inspector icon

        

        at the top right of the editor.

        

     2. Scroll down to Design.

     3. Select a design, and customize the menu's text, colors, and spacing. Learn more about designing anchor menus.

Linking an element to an anchor

Linking specific elements (e.g. images, buttons, and text) to anchors is a great way to direct visitors to content relevant to where they are on the site. When a visitor clicks the element, they're brought directly to the anchor.

To link an element to an anchor:

1. Click the element you want to link from.

2. Click the Link icon

   

   .

3. Select Anchor.

4. Click the Which page? drop-down, and select the page that contains the anchor.

5. Click the Which anchor on this page? drop-down, and select the relevant anchor.

6. Click Done.

Adding an anchor to a site menu

Only have 1 or 2 anchors on the site? You can display them as items in a regular site menu. Site menus are usually displayed on all pages, so this is a great way to make sure that visitors can always access important content.

To add an anchor to a site menu:

1. Go to your editor.

2. Select the menu in your editor.

3. Click Manage Menu.

4. Click + Add Item at the bottom.

5. Select Link or anchor.

6. Click Anchor from the options on the left.

7. Click the Which page? drop-down, and select the page that contains the anchor.

8. Click the Which anchor on this page? drop-down, and select the relevant anchor.

9. Click Done.

Frequently asked questions (FAQs)

Select a question to learn more about working with anchors.