Anchor links
With anchor links you can navigate through the page.
Anchor links can be used when customizing actions for:
- menu items to navigate through page sections;
- buttons;
- text links;
- block links.
1. Select the menu and open Settings in the right panel.
2. Open the menu settings by clicking the icon to the left of its name.
3. Open the action settings for the menu item.
3. Select the Anchor navigation action.
4. Click the Select Element button to configure where to navigate when clicking the menu item.
Next, select the desired element on the canvas or in layers and confirm your choice.
Keep in mind that the page will scroll to the top of the selected element. Therefore, it is better to select the section as a target, not the content inside it. You can also add back margin to the section if it has not been set up before. Then after scrolling, you will have free space at the top of the page.
5. Add smooth transition. To do this, enter the Scroll Speed value in milliseconds. For example, 400ms.
This setting will be the same for anchor links in all menu items.
6. Set up anchor links for the remaining menu items by repeating steps 2–4.
7. Publish the page and check the navigation to each menu item.
You can check the anchor links only with the published project. Navigation is not available in preview mode.
1. Select the button, go to the Settings and add the Action by clicking "+".
2. Select "On click" in the Action Trigger. Select “Anchor navigation” in the Action.
3. Select the element that will be navigated to when clicking the button. For example, the section with a contact form.
4. Add smooth transition by adjusting the Scroll Speed.
5. Publish the project and check how navigation works.
Anchor links for text link and block link are configured in the same way as for a button. You can choose custom scroll speed for each element.