Anchor Links

Example of Anchor Link when clicked talking you to the new location
By Stefan Popoff
1 min read

This article covers the following topics:

  1. What Is an Anchor Link
  2. How to Create an Anchor Link Now
  3. Limitations of Anchor Links
  4. Our Long-term Solution

 

What Is an Anchor Link
 

  • Anchor links are a way of creating a link to content on the same page. When you click on the link, you will automatically be taken to the destination on the page. An anchor link will help organize your content and users will be able to quickly find the content they are looking for.

How to Create an Anchor Link Now 

  1. Establish where you want the link to go to.
  2. In the WYSIWYG editor, select Source
    (Note: The destination location must be in a WYSIWYG with some other content.).
  3. Paste in the following code and change the “Sample” to a term that you will remember
    (users will not see this term). 
    • e.g.  <p><a id="Sample"></a></p>
  4. Click Save.
  5. Go to the WYSIWYG where you want the user to click the link to your anchor.
  6. Create a link as usual. In the URL, add “#” and then your “ID” from earlier. Using the above example, the URL would be “#ID”.
  7. Click Save. 
     

Limitations of Anchor Links 

  • If you are trying to use an anchor link on a Page (Layout Paragraphs), it will not work in two situations:
    • Accordions
    • Tabs
  • If you need to link to these types of content, a possible solution is to put the anchor just before the Accordion or Tab. 

Our Long-term Solution

  • We are creating a user-friendly solution to create anchor links. This will be a no code solution where you will only need to add an ID. The Web Platform Developers are actively working on the solution and we will send a communication to all users once the solution has been deployed.