HTML Signatures on the iPhone Revisited (updated 4x)
Due to popular demand, I’m posting an updated version of my iPhone html email signature that’s more broadly compatible with a range of email clients. This version of the html code replaces the CSS inline encoded background image with a standard image tag.
The code below has been tested to work (as of 09.29.08) in Apple Mail.app 3.4, iPhone 2.0, Outlook 2003, GMail (new version), Yahoo! Mail (new version), Hotmail and MobileMe.
Please note that when using this version, your recipient will almost certainly have to click a button or link to display the image unless you are already a “trusted sender.”
<div style=“font: 10px ‘Lucida Grande’,Verdana, Arial, Sans-Serif;
line-height: 18px;
color: #525252;
margin: 6px 0;
padding: 6px;
border-top: 1px #999999 solid;
border-bottom: 1px #999999 solid;
background: #fff;
height: 58px”>
<img src=“http://dfbills.com/images/avatars/iphone.jpg” width=“63” height=“57” alt=“photo” style=“float: left; margin: 0 5px” />
<p style=“margin: 0; padding: 0; float: left;”>
<strong>David F. Bills</strong><br/>
<a href=“http://dfbills.com”>http://dfbills.com</a><br/>
sent from my mobile</p>
</div>

Too bad you still need a jailbroken iPhone to install this properly. Thankfully, this particular modification tends to stay in place across upgrades- including 1.4 to 2.0.
For more information on the full hack, see my previous posting: Set a custom css signature on your iPhone.
Update 1: fixed curly quotes in code
Update 2: Another point to note is that the Microsoft HTML renderer, in both Outlook & Webmail, will not allow padding on IMG elements. In my example, I’ve taken 6px of padding out of CSS and moved it to the actual JPG.
![]()
Update 3: Make sure to reboot after updating the .plist file on the iPhone.
Update 4: Updated CSS code to finally wrap properly. Thanks to Patrick Crowley for the help.
comments on this post:
Are you saying that it displays poorly on the phone? Looks fine on my laptop.
I’m making another tweak to address the fact that microsoft’s html renderer won’t allow padding on IMG. Pretty much just adding whitespace into the JPG on the right side and removing the CSS value.
Attached is the image of what your code looks like on my iphone (2.0.1) as well as the plist file. let me know what you think.
http://www.darkunderdog.com/~underdog/com.apple.mobilemail.plist
I have followed your instructions to the tee, but can’t seem to get this to work under 2.0. After uploading the .plist file, rebooting iphone, when I try to send an email, the default “sent from my iphone” sig shows up. When I download the .plist, it seems to have stripped out the changes I made. Any thoughts?
Nevermind,
Turns out that after uploading the modified .plist file (before trying to write a new message on the iphone) I needed to restart the iphone. I think I read someone else had the same problem and fixed it by restarting.
Great info, Thanks
DarkunderdoG: I can’t test right now because I just restored my iPhone software and it went to 2.0.2. No jailbreak available yet.
As I use a Windows PC, could you please post your plist file?
That would be great…
Thxs,
Gerald
I have tried a number of things but can not make it work 100%. If I use the above then it moves the “website.com” and “sent from…” beneath the picture. If I use the background method then it shows up right on the iphone but, I can’t see the image in Outlook 2007 or Gmail.
I’ve updated the CSS code to wrap properly. Thanks to Patrick Crowley for the help.
Let me know how it looks for you.
So far I am not able to get this particular one to take. It’s overwritten by the default on reboot. I’m not sure what it is.
Sorry for the repost but, here’s what I’m trying to do:
<div style=“font: 10px ‘Lucida Grande’,Verdana, Arial, Sans-Serif;
line-height: 18px;
color: #525252;
margin: 6px 0;
padding: 6px;
border-top: 1px #999999 solid;
background: #fff;
height: 58px”>
http://www.broadcastworks.com/staff/iphone.jpg
Wesley S. Smith ::<br>
broadcastworks.com<br>
sent from my phone
</div>
You should really try the new code above (I updated earlier today). It treats the text portion as a block-level element, allows the alignment to work properly and forces a proper width to avoid wrapping.
I found that it works well to:
1. go to your home screen
2. upload the new file
3. check the signature in Settings: Mai, Contacts, Calendars: Signature
4. double check in MobileMail by creating a new message (make sure to close this and cancel before making additional changes)
Yeah, that’s what I did. I grabbed the text up top and used it. When I pasted the above I kept hitting enter prematurely. I used the new posting and changed my info but, it wouldn’t work for me so I reverted to my base64 version. It and the other versions I used work fine but, something I’m doing I guess is breaking it.
<quote><div style=“font: 10px ‘Lucida Grande’,Verdana, Arial, Sans-Serif;
line-height: 18px;
color: #525252;
margin: 6px 0;
padding: 6px;
border-top: 1px #999999 solid;
background: #fff;
height: 58px”>
http://www.broadcastworks.com/staff/iphone.jpg
Wesley S. Smith ::<br>
broadcastworks.com<br>
sent from my phone
</div></quote>
So, has this been tested with 2.2 yet? :o) I would love to have a simple, but custom, signature.
Not that I know of, but I’d expect that it works exactly the same. Also once you set it, it tends to stick- even across upgrades.
So, should I use the Firmware 1.1.4 or older with version of mobilemail on the Firmware 2.2?
I’d like to not brick it lol
Ok I have a good one for you.
Im old school and I like the Ascii art one
so how would I add a custom signature with this.
(so the dude looks like a real dude)
Have A Great Day!!!
Cheers,
Chris
——————————————————————————————————————-
\ l /
(@ @)
—-oOO-(_)-OOo—-
“Better than a thousand days of diligent study is one day with a great teacher”
pixelAFECT: As far as I know it works with all the shipping versions up to 2.1 and I expect that it works fine on 2.2 as well.
orionpower: I’d just use that with a monospaced font applied in the html.
Thanks but what is a monospaced font applied in the HTML.
I can crack your chest open and massage the life back into you. but I don’t understand what a monospaced font is?
i know its asking a lot but can you please copy paste the file or text and I will upload it to my iPhone first gen running 2.2 (5g77)
cheers
Chris
\ l /
(@ @)
—-oOO-(_)-OOo—-
orionpower: I finally had a chance to look at this.. try one of these. (I don’t have my phone jailbroken right now, so I can’t actually test if for you.)
<div style=“font: 10px ‘Courier New’, Courier, monospace;”>
<pre>
\ l /
(@ @)
—-oOO-(_)-OOo—-
</pre>
</div>
or this…
<pre>
\ l /
(@ @)
—-oOO-(_)-OOo—-
</pre>
One of the two should do the trick.
Ok, Tried this… I need a serious idiots guide for this using 2.2 Cus everytime it just puts back the “sent from my iphone” sig even after reboot… I’m completely jailbroken, I’ve got erica utilities and am on XP, as well as using winscp, having OpenSSH installed as well. Can ya help a brotha out? I’m an actor and I’d love to be able to link my sig to a pic and my demo reel link, possibly even a mailto: for my email?
I can’t seem to get the image to show.. Can some1 help?
I’m on 2.2, my code looks like this:
<div style=“font: 10px ‘Lucida Grande’,Verdana, Arial, Sans-Serif;
line-height: 18px;
color: #525252;
margin: 6px 0;
padding: 6px;
border-top: 1px #febf0f solid;
border-bottom: 1px #febf0f solid;
background: #fff;
height: 58px”>
http://chris10an.no/div/sign.jpg width=63 height=57 alt=photo style=float: left margin: 0 5px
Christian Buvik<br>
<a href=“http://www.posemedchips.no”>http://www.posemedchips.no</a><br>
Sent from my iPhone 3G
</div>
This is how it looks on my phone: http://chris10an.no/div/signature.jpg
Don’t know if maybe this will be more helpful: (image of the code I pasted into the .plist file)
http://chris10an.no/div/code.jpg
Hope some1 can help me!
Have you gotten this to successfully work on the 3.0 firmware? I’ve tried both editing on the iPhone with iFile and on my mac using PLE Pro. Erica’s iFile utility won’t accept any chagnes other than the addition of a div open and close command (no div style…). On the mac, I’ve used your code (minus the URL) and even tried a simple <DIV Style=“color:69999”>myname</div> without any luck. It appears the newest version overwrites the plist file whenever you reboot the iPhone. Any help would be appreciated.
I haven’t jailbroken 3.0 yet to test, but I will eventually. Has anyone else on this thread tried under 3.0?
Yes it still works under 3.0! I am in the process of posting a video tutorial to help others out: http://limitededitioniphone.com/guide-custom-iphone-css-signatures/
The signature follows my phone through firmware updates! ![]()
I just bought a 3GS though, and I forgot to make a copy of the signature string - so now I need to do this again..
Hello there. I see some have been meeting with lots of success with thehtml signatures but I have not been so fortunate.
The CSS signature with the dataURL stuff I have hands down. I got no problems with that.
This is what it looks like when I’ve finished doing it and added it to my iPhone, jailbroken of course. I haven’t had to do safe from text edit with that <string> stuff cause I got the plist application and everything is pasted in there after working in text edit.
http://lh6.ggpht.com/_BqIzPv7CiYg/SwJDqc6-jlI/AAAAAAAAAhM/5s-Shd9uhH0/IMG_0616.PNG
Now I was getting a bit fed up of the css signature because when I email people, only those with iPhones (sometimes) and the fortunate crowd of Apple users with Mail will see these beautiful signatures. I heard about the html signatures and I thought I will love it because now if I do it that way, everyone will be able to see my lovely signature: I won’t have to worry about my signature showing only in the Maill app. In doing the signature, I changed the image (http://idisk.mac.com/kofster/Public/kofster.jpg) but everything else stays the same.
This is what the code in the plist string looks like:
<div style=“font: 10px ‘Lucida Grande’,Verdana, Arial, Sans-Serif;
line-height: 18px;
color: #525252;
margin: 6px 0;
padding: 6px;
border-top: 1px #999999 solid;
border-bottom: 1px #999999 solid;
background: #fff;
height: 58px”>
<img >
Kofi M. Blades<br>
<strong>+1 (868) 399-6999<strong><br>
<a >http://twitter.com/kofster</a><br>
Sent via my iPhone3GS
</div>
and it turns out looking like this: http://lh6.ggpht.com/_BqIzPv7CiYg/SwJDqjzF2AI/AAAAAAAAAhQ/5GvAxOsMqv4/IMG_0615.PNG
Think you can help me out here, dfbills? Anybody?
You’re missing the image url from the code you posted. Your image line (right above your name) needs to read:
<img src="http://idisk.mac.com/kofster/Public/kofster.jpg" />
Also, you could try tables for layout and font tags for formatting to see if those older methods would be more compatible with a variety of email clients.
You must be logged in to comment on this post (damn those spammers)

Testing this the image seems to go higher on the left with the bottom level to the David F. Bills is this normal? I changed one part in the text above - Subsituted ‘ for ' as otherwise it would not work properly. - Tested in HTML on webserver looks like yours. Key Below any ideas?
<key>SignatureKey</key>
<string><div style=“font: 10px 'Lucida Grande',Verdana, Arial, Sans-Serif;line-height: 18px;color: #525252;margin: 6px 0;padding: 6px;border-top: 1px #999999 solid;border-bottom: 1px #999999 solid;background: #fff;”><img src=“http://dfbills.com/images/avatars/iphone.jpg” alt=“pic” style=“float: left; padding: 0 6px 0 0;”><strong>Luke E. Kalbert</strong><br/><a href=“http://www.url.com”>My URL.Com</a><br/>sent from my mobile</div></string>