Sander Verbruggen » gmail http://www.sanderverbruggen.com Is there anything I *don't* have an opinion about? Wed, 31 Mar 2010 09:45:11 +0000 http://wordpress.org/?v=2.8.6 en hourly 1 HTML signatures in GMail http://www.sanderverbruggen.com/2009/07/21/html-bookmarks-in-gmail/ http://www.sanderverbruggen.com/2009/07/21/html-bookmarks-in-gmail/#comments Tue, 21 Jul 2009 08:14:14 +0000 Sander http://www.sanderverbruggen.com/?p=20 HTML Signatures

HTML signatures can be created within Firefox using a simple plugin. This plugin doesn’t work with Safari or Fluid however. I will use Bookmarklets as an alternative to this plugin for Fluid. The page behind this link doesn’t work well with tables however, it adds dashed borders around each cell… This post covers how to get rid of them.

Step 1

Create an HTML signature using your favorite editor. And no, Word is not an HTML editor. Save it or at least get hold of the HTML code for your signature.

Step 2

Go to this site to convert your signature to a bookmark. First click the ‘HTML’ button in the edior’s toolbar on this page. Paste your HTML into the editor. If you used tables in your signature and press the ‘Text’ button in the toolbar (this button replaced the ‘HTML’ button when you clicked it), you’ll discover that your table cells really do have a dashed border. UGLY!
Click ‘Go step 2′ to continue.

Step 3

If you didn’t use tables, just drag your bookmarklet to your bookmars bar/menu and you’re done!

If you did use tables, copy the contents of the ‘Signature’ link. Using Firefox, simply righ-click and select ‘Copy link location’. If you’re using another browser you’ll have to figure this out yourselves…

Step 4

Create a small HTML file with the following code:


<html>
<body>
<textarea id="html_stuff"></textarea><br>
<button onclick="document.getElementById('escaped_stuff').value = escape(document.getElementById('html_stuff').value)">Escape</button>
<button onclick="document.getElementById('html_stuff').value = unescape(document.getElementById('escaped_stuff').value)">Un-escape</button>
<br>
<textarea id="escaped_stuff"></textarea>
</body>
</html>

and open it in your favorite browser.

Step 5

Paste the link you copied in step 3 into the lower textarea and click ‘Un-escape’. Select the text from the top textarea and copy it to a text editor. Now you see what has become of your hard labour: all those extra style elements creating those da[rn|sh]ed borders. Remove these and restore your code to it’s former glory. Copy the fixed code back into the page you opened in step 4, only now paste it into the top textarea.

Step 6

Click ‘Escape’. The lower textarea will now contain the almost usable bookmark. Copy it once more to a text editor for a final fix. At the start it says ‘javascript%3Avoid’. Change ‘%3A’ into ‘:’ (’javascript:void’) and you’re done. Finally copy this whole line into a bookmark in Fluid.

Now you’re ready to use it. Create a new email, click the bookmark and admire your work!

]]> http://www.sanderverbruggen.com/2009/07/21/html-bookmarks-in-gmail/feed/ 1