You can add links to your email so a recipient can jump through the content of your email by clicking a link.

For example, you might want to set up a table of contents in an email. In order, to do this you will need to be comfortable writing some basic HTML.

Here’s an example of an email newsletter with a table of contents.

Clicking on an item in the Table of Contents will take you directly to the relevant part of the email. Clicking the “Back to Table of Contents” link at the bottom of the email will return you to the top of the email.

table contents email example

Here’s the basics:

First of all you need to know how to access the HTML source for your email. In Flashissue you do like this:

  1. Click Edit Text on a content block
  2. Click the More button to access advanced options
  3. Click Source to view HTML

access email html

Example code for a table of contents

Click here to see the final email.

The name attribute allows an anchor tag to be used to point to a specific place on a web page. You might link from the bottom of a long page to the top of the page, or link from an item in a Table of Contents to the corresponding item where it appears on the page.

This is the type of HTML to use where you want to anchor TO somewhere in your email:

<a name="Table">Table of Contents</a>

This is the type of HTML to use where you want to anchor FROM somewhere in your email i.e. a user clicks this link in the newsletter and is taken to section called Table of Contents:

<a href="#Table">Table of Contents</a>

Step #1 – Create your Table of Contents

table contents html

Here’s the sample HTML for you to copy/paste into your email.

<h2><a name="TOC">Table of Contents</a></h2>
  <ol>	
     <li><a href="#Great-Things">Great Things</a></li>	
     <li><a href="#Better-Things">Better Things</a></li>	
     <li><a href="#Best-Things">Best Things</a></li>
 </ol>

Step #2 – Create your section links

table of contents email section

Here’s the sample HTML for you to copy/paste into your email:

Section 1

<hr />
<h2><a name="Great-Things">Great Things</a></h2>
<p>These are great things to eat.</p>

Section 2

<hr />
<h2><a name="Better-Things">Better Things</a></h2>
<p>These are better things to eat.</p>

Section 3

<hr />
<h2><a name="Best-Things">Best Things</a></h2>
<p>These are the best things to eat.</p>

Step #3 – Create your “Back to top” link

table contents email back to top

Here’s the sample HTML for you to copy/paste into your email:

<hr />
<p><a href="#TOC">Back to Table of Contents</a></p>
<hr />
<p>&nbsp;</p>

You can repeat these steps as many times as you like throughout your email.

 

Related articles