Adding Anchor Links to an Email

Anchor links allow recipients to navigate to specific sections of a message. They simplify navigation and are especially useful in long messages.

For example, you can add anchor links to a menu so recipients can quickly jump to specific product categories within the message.

Anchor link navigation demo
🚧

Important

Anchor links are not supported or may work inconsistently in some email clients, including:

  • Gmail (iOS)
  • Apple Mail (iOS)
  • Outlook.com (Web)
  • Outlook (Android)
  • Outlook (MacOS)

In the message editor, anchor links can be added in two ways:

  1. At the element level (via element settings);
  2. At the HTML level (by editing the message code).

Adding an Anchor Link via Element Settings

Step 1. Create an anchor

  1. Select the element you want recipients to navigate to.
  2. In the element settings, enable Anchor Link.
Anchor link element settings
  1. Specify the anchor name (for example, cakes).

Step 2. Add a link to the anchor

  1. Select the element from which the navigation should occur.

  2. In the Link field, enter the anchor name with the hash symbol (for example, #cakes).

Link field with hash
  1. Click Save.

Adding an Anchor Link via HTML Code

Step 1. Add the link

  1. Open the code editor.

  2. Select the element from which the navigation should occur.

Code editor element selection
  1. Add a link tag with the href attribute: <a href="#cakes">.
  2. Click Apply the Code.
HTML link code example

Step 2. Add the anchor

  1. Select the element you want recipients to navigate to.

  2. Add the anchor before the element: <a name="cakes" class="esd-anchor"></a>.

  3. Click Apply the Code.

Anchor HTML code example
  1. Click Save.

Testing Anchor Links

To verify that anchor links work correctly, send a test message to your own email address and test the added anchor links in supported email clients.

Test message preview