All Collections
Way We Do Basics
Creating Jump Links or Anchor Links In Procedures
Creating Jump Links or Anchor Links In Procedures
Dan Sargeant avatar
Written by Dan Sargeant
Updated over a week ago

In Way We Do, you are able to add anchor links to enable users to jump to another section of the same procedure page. Anchor Links are particularly useful if you have a long procedure and you wish to have links at the top of the page that allows the user to navigate to the section of the page they need immediately, without the need for scrolling.

You can achieve this by modifying the html source code within the Way We Do Edit Toolbar.

There are two steps required to create an anchor link which are:

  1. Creating the Anchor Link

  2. Creating the actual Anchor

Creating The Anchor Link

While you are in edit mode, click the html code icon in the Edit Toolbar.

Place the cursor where you would like the anchor link to be positioned.

Type the following code:

<a href="#enteranchorname">Link Text</a>

Where the text says "enteranchorname", type in the anchor name you wish to use. For example, if you want to the user to jump to heading one, the anchor name could be "headingone". The anchor name is not visible to the user. Please note: you must not use spaces in this name and you must include the hash '#' at the start.

Where the text says "Link Text", type in the words you would like to have displayed on the page. The link text are the words the user will click on to jump to the proceeding section in the procedure.

Creating The Actual Anchor

The second part of creating a functional anchor link is to create the anchor, the place on the page where the user will jump to.

Place your cursor at the beginning of the line where you want to start reading once you click the anchor link.

Type in the following code:

<a id="enteranchorname">Heading Name</a>

The anchor ID needs to match the anchor name used when the anchor link was created. The Heading Name are the words that are displayed on screen the user will start reading after they click the anchor link.

Note that this will create a link on the text 'Heading Name'. If you do not want to have a link, you can instead use the following code:

<span id="enteranchorname">Heading Name</span>

This will not create a link on the text.

Did this answer your question?