Anchor Links
Anchor links are web links that help your audience quickly jump to a specific section of a webpage and saves the need to scroll through a page heavy with text.
Example anchor link
Visual demo
Widget standards
Anchor links allow readers to quickly jump to a specific section on a page.
Do:
- Add anchor links to headers on a page. For example, heading 2, heading 3 and so on.
Do NOT:
- Add anchor links inside other widgets. They are designed to be used on
Written instructions
Before you create your anchor links, add your content to the page and save your work.
1. Open the page you'll be editing.
2. Click "Edit" on the Content Block widget. Add all your page content in.
3. After formatting your content with headings, click on the heading you want to add an anchor link to. Note: Anchor links can only be added to text with heading formatting.
4. Click on the anchor icon in the toolbar.
5. Type the name of the anchor into the Anchor Name field. This can be the same as the heading itself.
Alert! If the anchor link name has multiple words (i.e. Instructions for Anchor Links), there cannot be spaces between the words when adding the actual anchor URL. In such instances, insert hyphens between the words (i.e. Instructions-for-Anchor-Links).
6. Click "Insert."
7. At the top of your page, create an area for your anchor links. Most often this is a bulleted list with instructions to click on the links below to jump to that section of the page.
8. Highlight the text you'll be using to link to the anchor link you added earlier and click on the link icon in the toolbar.
9. In the link screen, click on More options.
10. Click the "Anchor" field and type in the anchor link label you created earlier.
11. Click "Insert link."
12. Once you've add all the anchor links you need for your page, click "Save."
Linking to the anchor links: other widgets
1. Add the widget and its layout to the page.
2. In the link area of the window, click the circle next to URL.
3. In the URL field, type in # and the name of the anchor you want to link to.
NOTE: The word you enter in this field must match the word you used for your anchor's name exactly or it will not work.
If the anchor link name has multiple words (i.e. Instructions for Anchor Links), there cannot be spaces between the words when adding the actual anchor URL. In such instances, insert hyphens between the words (i.e. Instructions-for-Anchor-Links).
4. Save your work.