Gmail - How to add HTML Signatures

gmail logoA few days ago, Google introduced a Canned Response feature in their Gmail Labs: it allows you to select saved, generic responses to reply to emails. The first thing that came to my mind: HTML Signatures. You can already have HTML signatures but it requires Firefox and plugins. I wanted to an HTML signature that I could access from work, IE or FF, PC or Mac.

The steps are pretty straight forward and all you need is a browser and an HTML editor: you can use MS Word, Dreamweaver, even (shudders) MS Frontpage.

Steps

  1. Enable the Canned Responses feature by logging into Gmail, clicking Settings, and then clicking the Labs tab at the far right. 
  2. Open your HTML editor.
  3. There are rules to how complicated your signature can get for two reasons: email filtering systems filter HTML emails and Gmail supports basic HTML.
    1. SIMPLE CSS only, no <head> tags, everything has to be inline
    2. Don't use floats for the layout, use tables
    3. GMail doesn't seem to support graphics so keep it tables and text only
  4. Once you have your layout, copy and paste the table (not the code, but from the preview view) into a blank email on GMail
  5. Click the Canned Responses link in the GMail WYSIWYG toolbar, click Save, and name it Signature. It may take some trial and error to get the look right.
  6. Next time you compose an email, select Signature from the canned responses and enter your email.
  7. For replies it's a bit more complicated because selecting a canned response deletes your message and replies: select Signature, copy your signature, undo (CTRL+Z or CMD+Z) and paste your signature.

That's it! If you have any tips or problems, let me know below.

Add new comment

Filtered HTML

  • Web page addresses and e-mail addresses turn into links automatically.
  • Allowed HTML tags: <a> <em> <strong> <cite> <blockquote> <code> <ul> <ol> <li> <dl> <dt> <dd>
  • Lines and paragraphs break automatically.

Plain text

  • No HTML tags allowed.
  • Web page addresses and e-mail addresses turn into links automatically.
  • Lines and paragraphs break automatically.