Thursday, June 7, 2007

HTML Multiple Reply Signatures for Gmail Firefox Extension

After spending the last three weekends working on the HTML Multiple Reply Signatures for Gmail Firefox Extension 1.0.1, I finally have a working prototype.

The Firefox Extension has all of the features and functionality of the HTML Multiple Reply Signatures for Gmail Greasemonkey script, except the extension doesn't require Greasemonkey. In addition, the extension provides a user interface for easy editing of signatures.

With Greasemonkey, users are required to edit the script manually in order to edit signatures. With the extension, this is no longer necessary.

For convenience, there is a real-time preview window so any HTML entered is immediately displayed for easy editing.

In fact, I'm thinking that the preview editor has some potential to be used in a number of applications, such as an HTML tutorial, HTML-area textbox for user comments, possibly a content-management system, and some other uses.

Since the user interface consists of XUL, these applications would all have a client-side feel to them, yet the potential exists to either serve them remotely or package them as Firefox Extensions.

The Firefox Extension

You should be able to install the extension in Firefox simply by clicking on the HTML Multiple Reply Signatures for Gmail 1.0.1 Firefox Extension link. If you are prompted to install, wonderful! Simply choose the "Install" option and restart Firefox. However, I noticed that -- when I tried to install by clicking on the link -- I was instead prompted to save the XPI file to disk.

If you experience this, follow these steps to save the XPI to disk and install it locally.

  • To install the XPI locally, open the Extensions/Add ons window from the "Tools" menu.
  • Next, drag and drop the XPI file from your desktop to the extensions window.
  • When prompted to install, click "Install".

  • Restart Firefox by closing all Firefox windows.

Using the HTML Multiple Reply Signatures for Gmail Firefox Extension

Creating a signature

  • In Firefox, click "Tools" -> "Gmail Multiple Reply Signatures".

  • Open HTML Gmail Multiple Reply Signatures Editor

  • Near the top of the window are two radio buttons. Use these to toggle between editing the signatures for initial compose emails or reply emails

  • Reply Signatures Initial Composes and Replies

  • In the "Initial Composes" section, select from four signatures to configure.

  • Select from four Gmail HTML signatures to edit for Composes and Replies

  • Enter HTML in the "Enter HTML Signature here" section. For attributes, do not use any quotes. Below is an example of a signature hyperlink where attributes are used, but without quotes:

  • <div>--</div><a href= style=font-family:tahoma;color:blue;>James Mortensen</a><div></div>

    Gmail HTML Signatures Editor

  • In the "Preview" section, you will see real-time HTML output based on your input in the "Enter HTML Signature here" section. You may fine-tune your signature until it appears the way you want.

  • Preview Signature using HTML Multiple Reply Signatures Editor

  • Once configured, click "Save".

Inserting the HTML Signature in Gmail

Inserting the signature is automatic. When you click "compose" or "reply", the first signature in the list will automatically appear in the editor. To change signatures, use the dropdown list at the bottom of the Gmail left navigation section. The signature will be changed automatically as soon as your selection is made.

View the demo here.

Known bugs

There are some bugs that I have come across so far, and I am sure that there will be more. If you discover a bug that is not in this list, please email me or post a comment to this post.

Sometimes it is best to release software instead of trying to correct every single bug. None of these are showstoppers, but here they are:

  • Quotes cannot be used around attributes

  • Simply leave out the quotes as they are not required.

  • Large sections of HTML may be corrupted when saving.

  • When you enter large sections of HTML and save, the next time you open the sgnature content editor, you will be reverted back to defaults. You can find your signatures in an xml file called htmlmultiplereplysignaturesforgmail.xml in your Mozilla Firefox profile directory. Save this information somewhere else, or copy and paste the non-corrupted signatures back into the editor. I plan to create some means of recovery for these types of errors.

  • The signature names can't be renamed

  • This functionality has not been completely implemented yet.

  • When pressing "Compose" in Gmail more than once, multiple drop-down lists appear

  • Just delete any unwanted signatures from the Gmail editor.

  • After entering email content, selecting a different signature will cause part or all of my email to be deleted.

  • Be careful not to type below the "--" characters. There are invisible markers around he signature that mark the dynamic section. (Actually, the signature is placed inside a span element. If you type below the "--", you are typing inside the span element).

  • Fixed in 1.0.1 on 6/9/07 - After entering a signature on multiple lines in the editor, the signatures would not appear in the Gmail compose or reply editors.

  • I enabled the multiline attribute of the textbox, which the script did not know how to handle. The temporary fix was to disable multiline support until I have time to fix the problem and test it thoroughly. Be aware that if you want line breaks in the signature, simply use a <br> or <div></div>


This is the first project I've done on my own that is outside the context of work or school. Please don't hesitate to give me advice about how to better track bugs, write better documentation, or make improvements to the application.

Also, if you have any trouble or need help, please contact me. I hope you find this Firefox extension useful!


Anonymous said...

James, I love your work...I've been using your GreaseMonkey script for awhile and just installed this one. But, I can't get the new one to work, even when I disable the old script or disable GreaseMonkey...

Tried refreshing, closing / opening, the whole 9 yards...


I'm on a mac if that's an issue...?

Rob Barnum

James Mortensen said...

Congratulations Robert! You're my first user to find and report a bug!

It turns out that the bug was caused by enabling multiline support in the Gmail Signatures editor. I've disabled it and released it as version 1.0.1.

I will re-enbable multiline support once I've had ample time to troubleshoot and test multiline support and how to integrate with the script.

I've also updated the original post to include this bugfix.


Unknown said...

This extension won't save the HTML signature. I pasted it into to the text box, can see the preview, removed all the quotations... but when I click save - nothing.

It doesn't save the signature, and when I go back to gmail and compose, it shows "undefined".

James Mortensen said...

Hi Steve,

Because the JavaScript that injects the signature into the Gmail editor and the Firefox Extension logic are actually two separate components, I used an XML data file to save the HTML representing the signature. The Firefox extension writes the signature to the XML file, and the Greasemonkey JavaScript reads the signatures from this XML file.

I have encountered the behavior you described when I tried pasting my signature into the HTML Multiple Reply Signatures editor. The two systems have trouble reading multi-line HTML.

The best thing to do is to type your HTML into the Extension editor so that it is all on one line. This will ensure that the XML file can be properly parsed. Use the live preview box to assist you in ensuring you are entering the HTML correctly.

If you need more help, email me with your HTML and I'll see if I can resolve your issue. Thank you for your comment!

Anonymous said...

Hi James,

I'm having the same problem as reported before... I pasted a piece of code into the "compose" window and every time I save the script disappears... I made sure not to have more than one (long) code line...

Any suggestions?



James Mortensen said...


Please make sure you have the most up to date version.

Also, I know it's kind of inconvenient to type the HTML in the editor by hand, but "pasting" the HTML into the editor is likely to cause problems.

Also, make sure that you are not using any quotes in the HTML, even around attribute values. Unfortunately, my method of injecting the HTML into Gmail causes conflicts when quotes are present.

Finally, the extension doesn't yet work with the new version of Gmail for some people. Version appears to work fine on my machine, but something may be causing my system to use the older version of Gmail...

The best thing to do, if you are having problems, is to paste the HTML in a comment or email and I can look and see what is causing the problem.

I'm going to look into redesigning the Extension so that it will work with quotes.


Unknown said...

Hi James - fantastic job here. Having a problem: I'll write my sig, save it, close the editor, restart Firefox and compose a new message in Gmail, but I'm not seeing the dropdown box. Can you tell me what I'm doing wrong? Thanks

k said...
This comment has been removed by the author.
Eleanor Eiland said...

This blog post is really great; the standard stuff of the post is genuinely amazing.