Add anchor tags for feature sections that link to content areas in your email design. You're basically adding a table of contents to the top of your email that links to corresponding content in the main body of the email. You can even add a back to top link that scrolls the email up to the starting point from the bottom.
Topics covered in this article:
Anchor tags require time to set up and test across email clients. Brace yourself for various behavior while testing! Not all email clients support anchors. For example, Outlook 2003 will only support this functionality if the anchors are set up exactly as outlined in this post. And others like AOL and Lotus Notes won't support anchors. In general, any webmail client (Ex, Gmail and Yahoo) should work fine as well as the latest version of Outlook.
Anchor links are added in the HTML of your email design. You'll have one section that acts like a "features section" where you add the first part of the HTML and then in each content section further in your email design you'll add the secondary tag that links the anchor.
In Modern Editor you can access your HTML in any text area;
or from the lower left HTML tab on any screen.
Here's the HTML code for each section:
Part 1 - Features Section
<p><a href="#anchor1"><span>Featured News</span></a></p>
Part 2 - Linked Content
You'll use "Part 1" for your featured section. Just copy/paste the second line for additional anchor links and change each anchor number (#anchor1, #anchor2, #anchor3 ....), this will allow you to link to the corresponding anchor link in the section below.
Use "Part 2" for the content section, in this area "#anchor1" should match "anchor1" as in the example code above.
Note: Gmail will not support regular anchor tags (example: <a href="#anchor1">Anchor One Title</a>), it support a slightly modified version
"<a href="#anchor1"><span>Anchor One Title</span></a>" which is also what we have in our example above.
Here's the HTML code for the top anchor and each feature section:
Linked "back to top" for each section
<a href="#top">back to top</a>