In the Rich Text Editor in Catalog, it is possible to add anchor links within the same catalog page to reference sections elsewhere on the page, such as links to a different section or back to the top of a lengthy page. To do this, some HTML knowledge is needed as these links currently can only be added directly into the HTML Editor using these instructions.
Creating the Anchor ID
The Anchor ID is the destination on the page that the anchor link will land.
Open the HTML Editor from the Rich Text field:
First, determine what to label the Anchor ID (such as “top” or another descriptor word to serve as the reference ID). Use unique names for every Anchor ID. Use the below code to create the Anchor ID (replace the word inside the quotation marks with your Anchor ID label):
These can be placed with or without text between the <div id=“anchor”> and </div> but should be placed outside of any paragraph or other formatting.
Creating the Anchor Link
The Anchor Link is the hyperlink that – when clicked – will lead to the Anchor ID just created.
In the HTML Editor from the Rich Text field, wrap the text that should lead the user to the anchor in a link tag:
<a href=“#anchor”>Link Text</a>
Match the href destination to the name of the Anchor ID. Remember to add the #, this indicates the ID.
Once both the Anchor ID and Anchor Links are added to the HTML Editor, Accept the change and Save the page. You can now Preview the update to confirm it is working as intended. Approve and Publish the item to reflect changes on the live site.
**Note for exporting catalog to Word: anchor links will not export, and text added for links (such as Back to Top) will appear as plain text in the export.**