An anchor link is a link that navigates users to a specific location on the page, and is sometimes referred to as a jump link. Use the anchor element when you want users to be able to navigate to a destination further down the same page, or to a specific location on a different page of your site.
The anchor element will not be visible to your users on the published web page; it will only be visible in the Brandcast design studio. Place the anchor element where you want the link destination to be. Then, once you've linked a button or other element to this anchor, users who click on that link will automatically scroll to the location of the anchor.
A couple things to remember:
- The anchor is the destination, not the link itself.
- The anchor link will always scroll to the top of your screen.
- Anchors can can only be dropped between elements. They cannot be dropped inside another element.
Adding an anchor to the page
Click and drag the anchor element icon from the left toolbar onto your page:
Place the anchor in the location where you want users to go when they click a link.
You'll see a green horizontal line extending from the anchor element across the page. This is a visual indicator of the location on the page that users will scroll to when they click the link:
Adding space between your content and your anchor link
When you click on an anchor link, the top of your new section may be cut off by your navigation if you have it set to sticky or fixed to page. To avoid this from happening, make sure your section has a top margin or padding that is equal to or greater than the height of your nav bar. Now there will be enough of buffer space between your anchor at the top of your page and the start of the content of that section.
An anchor can be moved around the page by grabbing it at its left edge and dragging:
Once on a page you can give it a name by double-clicking on the text, then typing the new name:
Note that for anchor links to work correctly, there are some limitations on how they can be named. If you type a name that isn't supported (for example, it contains spaces or characters that aren't allowed), the anchor element will automatically correct itself to an acceptable format.
Like other elements in Brandcast, anchors can be deleted from the page by selecting them and pressing the <delete> key on your keyboard, or by selecting "Delete" from the Edit menu in your top toolbar.
Linking to Anchors
Once you've added the anchor element to your page, you'll need to link something to it. This can be a section of text, a button, image, a link on your link list, or any other element of your choosing.
Linking to an anchor element works the same way as linking to an internal URL, external URL, or an email address. For a more thorough discussion of links, refer to this article.
Select the element that users will click when they are directed to your anchor location. Then open the link dialog by clicking the "link" button in the focus frame, selecting "Link" from the Edit menu in the top toolbar, or pressing ⌘K.
Select the "Page Anchor" tab on the left. The dialog will display all the available anchors on this website, listed under the page that they appear on.
Select the anchor that you want to link to, and close the dialog.
If you are unable to link to an anchor, delete the anchor and add a new one. If that does not solve your issue, please reach out to our support team.