How to Add a Hyperlink to Your Email Signature

how-to-add-a-hyperlink-to-email-signature

Want to know how to add a hyperlink to your email signature? In this guide, we will walk you through the exact steps to add a hyperlink in your email signature.

But, before we get started, it’s important to know exactly what a hyperlink is and how it should be used.

What is a hyperlink?

A hyperlink (also referred to as a “link”) is text in an HTML document or email signature (which uses HTML) that becomes clickable and takes you to another resource, either on the internet or locally on your computer.

There are hyperlinks all over the internet linking to other resources. It would be extremely difficult to find a website or email signature that doesn’t have a hyperlink on it.

Since email signatures are coded in a very similar way to websites (HTML), hyperlinks work the same in both instances.

Just to be clear on what a hyperlink is, this is a hyperlink to Gimmio, our email free signature generator.

When should hyperlinks be used in email signatures?

For many reasons, an email signature should be as small as possible. Because of this, it’s important to summarise your email signature details. For example, you wouldn’t put all the details of your website into your email signature, that would be ridiculous.

A much better idea would be to simply write the URL of your website, and link to it so your recipients can get to it easily.

Hyperlinks in email signatures are mostly used for:

Websites

Usually links to your personal blog or your company website.

Telephone Numbers

When tapping a click-to-call link on your phone, it makes the number automatically appear in your phone’s dialer and you can call it easily.

Address

Usually links to Google Maps or to their website’s “Contact Us” page.

Social Icons

Links to the respective social network such a Facebook, Twitter, Instagram.

Banners

Most of the time if you have a banner, you will likely have links to specials, discounts or sales on your website.

email-signature-with-hyperlinks

Why use hyperlinks in email signatures?

Hyperlinks are a convenient way to redirect your email recipients to other resources such as your social channels, or your website.

Without hyperlinks, it would be much harder to advertise your products and services in your email signature, because your recipients wouldn’t know where to go.

How to Insert a Hyperlink in Your Email Signature

For this part, you will need to have the HTML file with your email signature in it.

Step 1:

Open your email signature HTML file in a web browser like Chrome and figure out which part of your email signature you want to add a hyperlink to.

Since the website field has the text “gimm.io”, this is the text we will hyperlink to our website.

adding-hyperlink-to-website-field-email-signature

Step 2:

Open the email signature in a text editor such as Sublime, which makes it much easier to look at HTML code.

Do a search (Ctrl + F) for the text from the first step. In our instance, we will search for “gimm.io” (replace this with your own website or text that you’re trying to add a link to).

You will likely find code that looks something like this:

<span style=”font-family:Verdana, Geneva, sans-serif;font-size:14.0px;font-style:normal;line-height:16px;font-weight:normal;color:#535353; display:inline;”>gimm.io</span>

Notice on the second line, it has “gimm.io” in between the <span> tags? This is the text displayed in the email signature.

Step 3:

Next, you will need the hyperlink code below and modify it to your needs.

<a href=”https://gimm.io”>gimm.io</a>

The href attribute is where you want the gimm.io text to link to, and the gimm.io inside the <a> tags is the text that will show up in your email signature.

a-href-anatomy

Step 4:

Now, what we want to do is remove the existing text that says gimm.io in the <span> tags and paste the copied <a> tags inside the <span> tags.

Your code should now look like this:

<span style=”font-family:Verdana, Geneva, sans-serif;font-size:14.0px;font-style:normal;line-height:16px;font-weight:normal;color:#535353; display:inline;”><a href=”https://gimm.io”>gimm.io<a></span>

Step 5:

Save your HTML document, open it in Chrome to check if it’s working as a hyperlink and click on it to make sure it goes to the right website.

Once you’ve confirmed the signature looks fine, install your email signature in your email client.

Adding Other Types of Hyperlinks

You can also create other types of links in the same way. All you have to do is change the protocol section of the link.

For example, take a look at these 4 different types of links you could create using the same <a> tags.

For a standard website link:
<a href=”http://yourwebsite.com”>My Website</a>

For a phone number (click-to-call) link:
<a href=”tel:+1 (555) 1821 7716″>My Phone Number</a>

For an email link:
<a href=”mailto:name@company.com”>My Email</a>

For a Skype link:
<a href=”skype:my_username”>My Skype</a>

Notice the only difference is that we’re using different protocols at the beginning of the reference (http, tel, mailto, skype)?

As you can see, adding a link manually to your email signature can be really easy if you know how to do it. Hopefully, this guide has helped you out! If you have any questions, leave a comment below.

2 Replies to “How to Add a Hyperlink to Your Email Signature”

  1. I have followed this process, but, as soon as I send the message, the recipient can see the signature with the icons and images, but links to webpage, facebook, etc. are not shown and -obviously- not possible to follow. It did not work for either Outlook users, nor regular gmail, hotmail users. Any hint about how to solve this?

    Thanks in advance

    1. Hi Francisco,

      With most email clients, you must hold down the Ctrl key on your keyboard and then click the link in the email signature. This is a security feature that most email clients have.

      If this doesn’t work, feel free to paste a snippet of the HTML code where you did the link and I will have a look how you did it. If you created your signature using Gimmio, simply email us at support@gimm.io and we will take a look for you 🙂

Leave a Reply

Your email address will not be published. Required fields are marked *