Learn how to create an awesome HTML email signature and download some free templates to get you started.

I've always been a big believer in Text-Based email signatures — that is, those that don’t contain HTML — so you don’t have to constantly “load images” and everything else that comes with creating a HTML signature. Something like this always has worked for me:

Thanks,Tim

Blog: http://www.timdavis.com

Twitter: @iamtimdavis

Facebook: @timdavis

However, with the increasing reliance on social media the importance of promoting yourself, and your business, through simple measures such as a HTML email signature — I’ve decided to convert for a while to a HTML based signature and see how it goes. Of course, the question becomes one of how to do this so that it still looks professional (at least in my opinion).

I’ve gone about to create a HTML template that you can easily use inside your Gmail or whichever email provider you use — assuming they allow you to enter a HTML-based email signature. Before we get started — I’ll show you what it looks like for me:

And of course, you can alter it a little (I’ve also done this below) so the icons are along the bottom. I’m using the totally cool icon set from Ristaumedia which is available on DeviantArt here.

Getting Started

To get started creating your kick-ass email signature you’ll need to do a few things — the most complex (which isn’t really complex) is to pull up your Facebook profile photo. This is really simple now that Facebook have allowed you (and notably, everyone else) access to your data. To grab your Facebook image — just do this:

http://graph.facebook.com/username/picture

So for example — my Facebook thumbnail photo is available via

http://graph.facebook.com/timdavis/picture

as my Facebook profile is http://www.facebook.com/timdavis.

Once you’ve completed this step — you’re basically set to go and edit one of the simple HTML templates I’ve created.

Template 1

The first template is simple and includes ONLY Facebook, Twitter and Linked-In details. And looks like this:

Basically, you can download the template and edit it in your text editor on your computer. You just need to update the links within the HTML code to your own links and then open it in your browser — you can then simply use “Ctrl+A” (PC) or “Command+A” (Mac) and copying the selection and then paste the template into your email signature. Download the template here with the included social media icons.

Template 2

The second template includes more social media icons and looks like this:

As with the above template — you can easily just edit this via a text-editor on your computer and then open it inside a browser on your computer. Then it’s just using “Ctrl+A” (PC) or “Command+A” (Mac) and copying the selection and pasting it within your email signature on your email client. Download the template here with the included social media icons.

Integrating it with Gmail

To integrate your new found signature with Gmail, just hit the “Settings” option in the top right hand corner of your Account and then go down to signature. You can then just hit Paste after you’ve copied and it’ll look like this:

After that, just hit “Save Changes” and you’re done. You’ve now got a shiny new email signature with all your social media links.