Set a custom css signature on your iPhone (updated 4x)

Can you send me that icon template so I can put my picture in there?

I’ve posted it right at the end of the story.

Also will this not work with text editor?

how do you compact the line breaks?

David;

I’m REALLY sorry but I cannot get this to work right… Even if I copy & paste your code provided into the plist file, I get your text & link without any issue, but the image is not there.

With my signature, I upload the file from my desktop for example, it is under the 50K request from the site that converts the picture, I replace the image request in the code with base64 code, I save the plist file and upload it to the phone via SSH. However, when viewing on the phone, the image is a blank box where it should be, and my text is there without issue.

I can send an email and when the email arrives at the destination, I get the text of the signature, the top & bottom bars as to where the signature is, but a blank box (no outline) where the image should be.

Can you be of any assistance? I am editing the signature before uploading in TextWrangler (not textedit) on my Mac, using PListEdit Pro.

Thank you so much in advance for your help… It’s an awesome thing to do, I’m just confused!

Cancel that… I figured it out.

Hey Oseary, how did you fix it? I have the same problem.  No matter what I do, the image doesn’t work, whether a link or a base64 image.  Also, when I try to change it to an img tag, I have a hard time formatting it properly without lots of work.  What was the magic fix? I always end up with a blank space where the image should be.

Adam!

I was able to figure it out by doing a lot of piddling as to how to properly place the base64 code.

The code that I was copying via the site was NOT doing the trick.

However, I was able to take the code from his up above, that is between the “ ‘ “, after it says, “URL(” and at the end of the code where you have to scroll over, near the “Z’)”

What has to be done, is you have to keep those ticks in place, but you still need to get the code generated… What I then did, was get the code generated via the website provided, as your image that was converted will show up on the code page… I simply right clicked and did a “properties” of the image (I’m in Firefox), and copied the long bit of code that was in the “location” area of the image properties.

What I also did was to copy his code directly into PLE, and then was able to isolate the ticks inside of that, then delete the crap that was between it, and directly copy it from the image properties, and paste it between the ticks… I edited the rest of it, as I obviously have a different name, and I wanted my phone # in the signature, as well as a different tagline than “sent via mobile.”

I saved, up’d it to the phone via SSH, and there it was!

I was incredibly, incredibly confused, as I was confident that TextEdit and TextWrangler was messing everything up… I also didn’t know how to choose where and how to shorten up the line breaks like he stated above.

Hope that helped! And David, I apologize that I took up so much space!

I posted a link on my site (pesosforpenguins.com) linking to yours, and if you don’t want me to, simply shoot me a comment via my site, and I’ll remove it!

So, the base64 code should be inserted as follows..

background: url(’data:image/png;base64,iVBORw0KGgoAAAAN....THE REST OF YOUR CODE...RU5ErkJggg==’) no-repeat 0 1px;">

After that you insert your name or whatever you feel like inserting.

One notice...the image coded as data doesn’t display in Gmail (neither web nor in email client), and just now I checked Yahoo..no like there either. How come? Otherwise it works..thanks for the tip

One more thing..is there any way of setting the encoding as UTF-8 in this piece of html? My last name is Tomić, but when displayed in Yahoo the last, accented letter converts to something totally different. Any solution?

Any one know of a windows program that will edit the file correctly? Using notepad with a binary file doesn’t appear to work properly.

Any xml editor should do it. Notepad2, Notepad Pro, UltraEdit…

for anyone having trouble, heres some referances:
use realtime html to edit your code and view your changes: http://htmledit.squarefree.com/

use http://140.124.181.188/~khchung/cgi-bin/plutil.cgi to convert the encrypted com.apple.mobilemail.plist

worked great for me, thanks david!

how can I change sent from my mobile to a lower font?

in the first line look for “<div style="font: 10px”
change that to “<div style="font: 8px”

or whatever other # you want

I want the name to be 10px and the sent from mobile to be 7px

Just instead of “sent from my iPhone” insert this

<div style="font: 7px ‘Lucida Grande’,Verdana, Arial, Sans-Serif">
sent from my mobile
</div>

This rule applies to all further changes regarding color, size, border.. of any of signature’s elements

using david’s example above heres the code:
http://pastie.caboo.se/120379

yu’ll notice:
<style type="text/css">
<!--
.style1 {font-size: 7px}
-->
</style>

in the begining.  This is where you set your font size for “style1”

then before and after the “sent from my mobile” you’ll see:
<span class="style1">sent from my mobile</span>

so your specifinf that text as style1 which before you said was 7px.

I’m no CCS guru, but this works on any webpage so it should work on the iphone too. If not, try defining the style after the first div tag.  This should work

+1 for mario, thats much easier then my idea and he typed that while I was typing my reply

shaiss, your way is a proper one, that way should be defined all new points of change in code, but since the iPhone sig code is a relatively short one, we can neglect certain rules and apply them directly where needed

One thing to note is that if you make the filesize of the sig too large, the iPhone won’t load the whole message.  You’ll always get the “load the rest” widget at the bottom of your received message.

good point David, however with the image at 57x57 its usually 1/2kb and text can’t take too much space.  But I see how ppl could go myspace on there sig

anyway of getting around the images not showing up in some email clients?

So, I can edit the file, but having trouble uploading it back to my iPhone ... I am using Windows and using Notepad2 isn’t working.  What program can I use to edit the file and get the iPhone to recognize it (in Windows) or do i need to borrow

You need something that can edit binary plist files.  You might try XMLSpear.

Hallo!  Wanted to write in and say thanks for a wonderful tip, and to let people know it is possible for Windows users to do this.

Use Erica’s Utilities and the program “psutil” to convert the binary plist file to text.

~\bin\psutil -c xml1 com.apple.mobilemail.plist

Transfer it to your PC, and prepare to add your custom signature code.  Before you add it, however, open a blank text file and past it in there.  Before we inject our custom html code for the signature, Windows user’s can’t leave the angle brackets as they are.  We have to replace &#lt; with &lt; and &#gt; with &gt;

Once you do that, add the code into the plist file as described, then transfer it back.  After you do, convert it back to binary format:
~\bin\psutil -c binary1 com.apple.mobilemail.plist

If everything is OK, the file size should be about the same as the text-formated version.  If the file size drops to 0, then there’s still some characters in there breaking the xml.  Changing the angle brackets to their coded versions should be all you need, however.  See this page for more codes.

Well, my last post didn’t turn out how I expected.  What I was trying to say was, replace left-angle-brackets with &lt; and right-angle-brackets with &gt;

help!
i cant get this thing working…
i’m running ubuntu,
compiled the file to xml format..
edited the signature,,
recompiling it to binary and the file size is 0 (zero)! why?
i’ve tried my signature here: http://htmledit.squarefree.com/ and it’s OK…

i’ve only copyed the html code inside the String section…

what can I do?

Are you compiling on the iPhone?  If so, your sig may be to big and causing the iPhone plist converter to crash.

what’s the size limit? i think that my sig is 7.7K, if it’s too big how can I reduce that side?

When you compile and it goes to 0, it’s either too big or more likely there’s invalid xml in there.  I had to change the angle brackets to their equivalent &-codes for it to be happy.

I had the same problem; i even tried with a very reduced file size. (am compiling on the iphone with “iputil”, since I only have access to a Windows machine right now) I did change the angle brackets—but there must be something else “corrupting” the file.  I am at a loss on what I am doing wrong

i can’t seem to get these nice signatures to show up in outlook - does outlook even support base64- or data-url-images?

I have a problem.
I cant see the .plist file when i ssh into my phone or when i use an sftp client like cyberduck.
I installed a program called finder on my iphone and i can see the file there, but there is no way to copy and paste the sig. I even tried changing the permissions on the file to 777 and still cant see it. ive tried downloading the file from another site changing that file and then uploading it, but it doesnt work.
Any Advice?

Thanks

c0mputernick: The reason is that the file has moved in firmware 1.1.4.  I’ve updated the information above, but here’s where it is now:

/private/var/mobile/Library/Preferences/com.apple.mobilemail.plist

Thanks for the help, ive found the file.
I took your example, got my url from the Data URL generator, replaced the code from ‘data to the last ‘ and then save and upload, but it keeps giving me your sig, not the image i uploaded. ive double and triple checked it and it looks right.  So I dont know what im doing wrong, but im close. Any ideas?

Have you tried rebooting your iPhone?

Yes an it had no effect.

I’m not sure what to say.  Sounds like that file is not being properly updated.  I’d delete it completely, reboot then replace. 

Also make absolutely sure that you’re using this path with the latest firmware:

/private/var/mobile/Library/Preferences/com.apple.mobilemail.plist