Iuliia Nesterenko

Technical Writer

How to Add Anchor Links and Hyperlinks to an Email in the eSputnik Editor

Links in emails, especially long ones, perform several important functions: lead customers from the email to the necessary pages, help track the effectiveness of the campaign, and improve the email navigation, when placed right. That’s why you need to pay special attention when adding them to your messages.

Hyperlinks

Hyperlinks, or regular links, lead customers from an email to the website pages, landing pages, images and other media files and pages.

According to eSputnik, a promo campaign includes about 20 links. Menu sections, images, video, banner, CTA, social media icons – a link should be added to each of these elements of the email. This helps collect statistics and analyze user behavior.

Click analytics

Your subscribers click the links personally they find the most interesting, meaning the click map will differ for each particular person. Elements that look attractive to some users, may be totally irrelevant for others. Email statistics by links show what exact elements perform better, and help adjust your further email design: add bright CTA, banners, GIFs, images, videos, or delete those that generate no reaction at all.

How to Add a Hyperlink to Text

In the eSputnik email builder, you can insert a link in the email in several clicks. Just select the necessary piece of text and click the link icon in the top toolbar.

Email link

In the settings on the left, insert the URL in Link. The hyperlink is highlighted by default; you can change any color in Link color.

Email link

When adding a link to the text, follow these tips:

  • Add a link to two or three words;
  • Use keywords in the beginning if you use long text;
  • Don't add similar text with different links;
  • Text should let understand where the link leads.

Links in email

How to Add a Hyperlink to Video

  • Drag a structure with one container to the template;
  • Drag there a Video block;

Email builder

  • Click it to the settings on the left;
  • In Link to video, insert the corresponding URL.

The editor will automatically add a preview image, alternate text, and play button.The block with the clickable built-in video is ready.

Email editor

How to Add a Hyperlink to Contacts

Contacts (email address, phone number, Skype) are typically located in the email header or footer. They enable recipients to get in touch with you in the most convenient way.

When trying to write you an email, few people would bother to first copy your address, then go to their email client and insert it to compose a new message. A :mailto link simplifies the process by allowing to save time and contact in one click.

  • Drag a new structure to the template;
  • Drag there a Text block;
  • Enter your contact (email address here);
  • Select it, click the Link icon in the top toolbar and add a link.

Open code editor

  • In Link, select Mail from the drop-down menu.

Drag-and-drop email editor

You can add links to a phone number or Skype in the same way. The only difference is that you need to choose Tel or Skype correspondingly in the link settings.

Links in email builder

Important! Outlook and iOS don’t support the :mailto link. Gmail on Windows and on Android displays it correctly.

350+ Free Templates for New Users

How to Add a Hyperlink to Social Media Icons

Some marketers insert clickable social media icons into the menu or to the header, but most add them to the footer. It’s up to you what placement to opt for.

  • Drag a new structure to the template;
  • Drag there a Social block;
  • Click it to open the settings;
  • Insert the necessary links.

Social links in email builder

You can also change icon design, specify size, and add new icons, if needed.

Social links design

Note! To avoid manual configuration of each template, save the necessary block, structure or stripe as a module and drag them to your further campaign from My modules.

You can also enable Synchronized while saving. The block will be saved as a synchronized module, and all information in it will be automatically updated in all templates that contain this module.

Add links to email builder

How to Add a Hyperlink to a CTA

  • Drag a Button block where you want to place your CTA;
  • Add the link;
  • Enter button text;
  • Configure button settings: text style and color, button color, border radius, alignment, etc.

Links in CTA

How to Add a Hyperlink to an Email Menu

  • Drag a new structure to the template;
  • Drag there a Menu block;
  • In Menu type, choose the necessary type (links, icons, icons and links);
  • Enter each item’s name or upload the icon;
  • Insert corresponding links for each item.

Links in email menu

How to Add an Unsubscribe Link

According to the GDPR and some other customer privacy policies, an unsubscribe link should be present in every email you send. Usually, it’s placed in the footer. The link should be clear, visible and easy to spot.

To add it to the email:

  • Drag a new structure to the bottom of the template;
  • Drag there a Text block;
  • Type the word Unsubscribe (or your custom text);
  • Select it, click the Link icon in the top toolbar and add a link;
  • In the drop-down menu of Link, select Unsubscribe from newsletters.

Clickable unsubscribe link

How to Add a View in Browser Link

For subscribers who can’t view or download HTML emails, you can add a View in Browser link. It leads to the full web-hosted version of your email that is kept on our servers. The link is often placed at the top right of the email, and the text View in Browser is typically default. However, there may be options like No images? Click here, View this email in your browser, Email not displaying correctly? View it in your browser, etc.

  • Drag a new structure to the top of the template;
  • Drag there a Text block;
  • Type View in Browser (or your custom text) at the top right;
  • Select it, click the Link icon in the top toolbar and add the link;
  • In the drop-down menu of Link, select View in browser.

View in browser

Last post

Anchor Links

An anchor link is a link that leads the reader to a specific place in the email. Anchor links are typical of long email copies (most often used in the menu) where they serve to improve navigation. Using them, readers can skip the irrelevant sections and jump straight to the content they’re most interested in at the moment.

In the eSputnik email builder, you can add HTML anchor links to the template in two ways.

#1. How to Add an Anchor Link

  • Click the place in the email you want to lead readers to;
  • Click Code editor to open the code of the selected element;

How to add anchor links

  • Add a name="casual"> to the code as shown below. Text casual refers to the section you will add the link to. You can add any other anchor text depending on your email;

html anchor tag

  • Click the text that will contain an anchor link;
  • In Link, select other and enter #casual.

Anchor text

Note. Each new link should contain different anchor words in the code and in Link; otherwise, all links will direct to the same place in the email.

HTML anchor linkHTML anchor link settings

#2. How to Add an Anchor Link

  • Drag an HTML block above the email section you want to lead the reader to;

Adding anchor links

  • Click the block to open the HTML editor;
  • Insert ;

Colorful anchor

  • Select the text or click the block that will contain an anchor link and open the code editor;

Email menu

  • Find the necessary text and add in its code “#arrivals” after href= before >.

Add code

Repeat these steps for the rest of the menu items.

Email Clients That Support Anchor Links

  X
Gmail (Desktop Webmail) +  
Gmail (Mobile Webmail) +  
Gmail (Android) +  
Gmail (iOS)   -
Apple Mail (macOS) +  
Apple Mail (iOS)   -
Outlook (Windows) +  
Outlook (Windows 10 Mail) +  
Outlook (macOS)   -
Outlook (Outlook.com) +  
Outlook (iOS)   -
Outlook (Android)   -
Yahoo! Mail (Desktop Webmail) +  
Yahoo! Mail (iOS)   -
Yahoo! Mail (Android)   -
AOL (Desktop Webbmail) +  
AOL (IOS) +  
AOL (Android)   -
Samsung Email (Android)   -
Mozilla Thunderbird (macOS)   -
ProtonMail (Desktop Webmail) +  
ProtonMail (iOS)   -
ProtonMail (Android)   -
HEY (Desktop Webmail)   -
Orange (Desktop Webmail) +  
Orange (iOS)   -
Orange (Android) +  
SRF (Desktop Webmail)   -
SRF (iOS)   -
SRF (Android)   -

Source


Links are an important part of every email. They help recipients navigate the copy and enable marketers to track their activity. Don't forget to test your emails before launching a campaign, as a broken or incorrect link can kill the effect of otherwise perfect email.

0.0 from 5 based on 0 reviews

Iuliia Nesterenko

Technical Writer

A technical (but still very creative) writer at eSputnik with a strong focus on design, current digital marketing trends, and new solutions for email automation.

Comments 0