Creating Anchor Links

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):

<p id="anchor"></p>

These can be placed with or without text between the <p id=“anchor”> and </p> 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 with the path to the item the anchor link is going to with the anchor following the hashtag:

<a href="https://domain.smartcatalogiq.com/en/current/catalog/general-education#anchor" target="_blank">Link Text</a>

Match the href destination to the page and 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 anchor links will appear as plain text in the export.**

Articles in this section

See more
How to Contact Support
There are many ways to reach out! Click here for our support options.
Watermark Academy
Click to access the Watermark Academy for consultation, training, and implementation companion courses.
Customer Community
Can’t find the answer? Ask fellow users how they’re making the most of Watermark in our Community!