gaurav’s rants

[Tutorial] Adding Extra Fonts to iPhone

by gaurav on Aug.31, 2008, under iPhone

continuing the posts about fonts.. here’s how you can add extra fonts to your iPhone for use with WinterBoard and maybe other applications as well..

Advantages of adding extra fonts:

  • Set your SpringBoard icon labels to the font of your choice [through WinterBoard]
  • Get extended font support for viewing websites in Safari
  • Get extended font support in applications, either as a user or a developer

For this tutorial I will add the Calibri font family to my iPhone, the following fonts of this family should be available on your computer by default

  • Calibri
  • Calibri Italic
  • Calibri Bold
  • Calibri Bold Italic

[i'm doing this on a Windows Vista system, if you're not using Vista some steps for obtaining the fonts may be different]

Terms for this tutorial:
Font Family is the font class, a font family may have many similar fonts, these fonts have different names and slightly different styles. eg Arial, Helvetica, Calibri are font families
Font Name is the name given to a font eg. Calibri, Calibri Bold, Calibri Italic are fonts in the Calibri font family
Font File Name is the filename for the font file. eg. Calibri.ttf, CalibriBold.ttf
Note: changing the filename for a Font File *does not* change the Font Name for that file. i’ve seen many people tryin to get fonts to work by renaming the files. it simply won’t work because no matter how many times you change the filename, the metadata contained in the file remains the same. a Helvetica font is a Helvetica font whether it’s named Helvetica.ttf or Calibri.ttf

Copy the fonts:

  • 1. Start > Run, or WinKey + R
  • 2. Type fonts in the Run window that opens
  • 3. Hit Enter
  • 4. This will open the Fonts folder. alternatively you can open it through My Computer C:/Windows/Fonts/ [where C:/ is your windows drive]
  • 5. Make a new folder Calibri on your Desktop
  • 6. Find the Calibri fonts in the Fonts folder and select and drag them to the Calibri folder, or use copy/paste.
  • 7. The fonts will have these file names
    • Calibri: calibri.ttf
    • Calibri Bold: calibrib.ttf
    • Calibri Italic: calibrii.ttf
    • Calibri Bold Italic: calibriz.ttf
  • 8. Rename the font files to these names
    • Calibri: Calibri.ttf
    • Calibri Bold: CalibriBold.ttf
    • Calibri Italic: CalibriItalic.ttf
    • Calibri Bold Italic: CalibriBoldItalic.ttf

    I prefer not to have spaces in the filenames that i’m going to put on my iPhone.

Install fonts on iPhone

  • 1. Connect to your iPhone using WinSCP or Fugu via it’s IP address. username: root, password: alpine
  • 2. Navigate to this folder /System/Library/Fonts/Cache/
  • 3. Create a new folder MyFonts in the Cache folder
  • we’ll copy our new fonts in this folder so that they are easily identifiable and properly organized.

  • 4. Copy the four files for Calibri font to the MyFonts folder
  • 5. Navigate to the folder /System/Lobrary/Fonts/
  • 6. Copy the file CGFontCache.plist to your desktop and use this link to convert it to plain xml format. http://140.124.181.188/~khchung/cgi-bin/plutil.cgi
  • 7. Open the converted CGFontCache.plist file with your favorite text editor.
  • 8. There are two sections in this file you need to edit Names and TraitMappings
    • Names is an array which has key value pairs of the Font Name and the Font file name.
    • it has the following syntax

      <key>Font Name</key>
      <string>Full Path to Font File</string>
      

      in this section add these lines at the start

      
      <key>Calibri</key>
      <string>/System/Library/Fonts/Cache/MyFonts/Calibri.ttf</string>
      <key>Calibri Bold</key>
      <string>/System/Library/Fonts/Cache/MyFonts/CalibriBold.ttf</string>
      <key>Calibri Italic</key>
      <string>/System/Library/Fonts/Cache/MyFonts/CalibriItalic.ttf</string>
      <key>Calibri Bold Italic</key>
      <string>/System/Library/Fonts/Cache/MyFonts/CalibriBoldItalic.ttf</string>
      
    • TraitMappings is an array which maps the various font styles to fonts of a font family.
    • it has the following syntax

      <key>Font Family Name</key>
      <dict>
      	<key>Plain</key>
      	<string>Font Name</string>
      	<key>Bold</key>
      	<string>Font Name</string>
      	<key>Italic</key>
      	<string>Font Name</string>
      	<key>Bold-Italic</key>
      	<string>Font Name</string>
      </dict>
      

      Note: the four elements are fixed, you can not use any other values for these, they must be Plain, Bold, Italic, Bold-Italic. The font name will vary from font to font. If you don’t have a particular font for a font family simply exclude the respective lines from it’s entry, ie if you only have Plain and Bold fonts use only the Plain and Bold <key>,<string> pairs and exclude the Italic and Bold-Italic pairs.

      in this section add these lines at the start

      
      <key>Calibri</key>
      <dict>
      	<key>Plain</key>
      	<string>Calibri</string>
      	<key>Bold</key>
      	<string>Calibri Bold</string>
      	<key>Italic</key>
      	<string>Calibri Italic</string>
      	<key>Bold-Italic</key>
      	<string>Calibri Bold Italic</string>
      </dict>
      
  • 9. Respring/Reboot your iPhone to load the new fonts and test them.
  • 10. Result
  • the HTML page

    <html>
    <head>
    	<title>Calibri Test</title>
    
    	<style>
    		#calibri	{
    			font-family: calibri;
    			font-style: normal;
    		}
    		#calibrii	{
    			font-family: calibri;
    			font-style: italic;
    		}
    		#calibrib	{
    			font-family: calibri;
    			font-weight: bold;
    		}
    		#calibriib	{
    			font-family: calibri;
    			font-style: italic;
    			font-weight: bold;
    		}
    	</style>
    </head>
    <body>
    <div id=calibri>Calibri</div>
    <div id=calibrib>Calibri Bold</div>
    <div id=calibrii>Calibri Italic</div>
    <div id=calibriib>Calibri Bold Italic</div>
    </body>
    </html>
    

    is rendered like this in MobileSafari
    Before:

    After:

i hope you find this tutorial useful…. :)

Share and Enjoy:
  • Twitter
  • Digg
  • StumbleUpon
  • Reddit
  • del.icio.us
  • Technorati
  • NewsVine
  • Facebook
  • MySpace
  • Google Bookmarks
  • Slashdot
  • Mixx
  • LinkedIn
:, , , , , ,
30 comments for this entry:
  1. guest

    Thanks for writing this. It appears that I followed these steps exactly before all the way up until step 9. I forgot to reboot. Anyways, thanks again

  2. meerz

    any ideas on how to add a language to the iphone ?

  3. Com3

    I second that, is it possible to add a second language to the phone, the phone can read the characters of that language with ease, Arabic that is, however the letters are separated, any way where we can attach those letters? and maybe add a keyboard layout?

    Thanks

  4. Hung Luu

    Gaurav, have u try to theme the font with Winterboard ? I tried to theme it but no luck at all

  5. gaurav

    @Hung: yes i tried it too.. apparently WinterBoard doesn’t have this functionality yet. maybe it’s not possible to implement it with WinterBoard. i’ve made a simple [very simple] script that i use to swap fonts on my iPhone though.. will post it soon.

  6. Hung Luu

    I now can theme it with winterboard. But there’s 1 thing. Wb does not theme the whole system, it just theme the springboard font. Dont know is it because of the font or what other reason causes this. I remembered I read somewhere that if u want the whole UI font, u have to add sth to the font like when u port it . But i’m still figuring it out

  7. gaurav

    @Hung: WB has the feature to theme the icon labels since long, besides a few other text items like the clock, however it does not make system wide changes as it is not practical to create hooks into all the applications.
    a font has to be ported to iPhone for use a tutorial for which can be found in this post..
    http://blog.gauravgiri.com/2008/08/tutorial-port-fonts-to-iphone/

  8. yasser

    @guarav Thanks, but I have a problem, i followed the steps but instead of Calibri i’m trying to add Tahoma, its not working Safari keeps on crashing if im viewing a site with tahoma font.
    One thing I did which you didn’t mention is, I converted the xml file back to binary .plist and then sshd it to fonts folder is this right?
    @rahul I used this link, https://brokolice.drsny.net/iphone/plutil/ to convert my .plist

  9. Liza

    My friend on Orkut shared this link with me and I’m not dissapointed that I came here.

  10. Cin Do

    How about Apple iPod TOUCH 8GB WiFi Video 2nd Generation GRADE A?

  11. Sonspesse

    Хм,несогласен с предыдущими ораторами
    ) Bye

  12. Wolf Paul

    Hello,
    I followed your instructions with the free Windows TTF font “Calligraph421BT.ttf” but it is not recognized as a font file on my iPhone 3G with OS 3.0. (The .plist file seems to be o.k. because the iPhone knows the font is there — just doesn’t display the glyphs)

    Conversely, when I copy a TTF file from the iPhone to my Windows Fonts directory, it is not recognized as a font file by Windows.

    Can you explain what the format differences are between iPhone and Windows TrueType fonts?

    Wolf

  13. FontInstaller

    I tried the tutorial the exact same way, then I tried in many different ways, but nothing works.

  14. rudeboy

    oi,

    as soon as i put an un-compiled CGFontCache.plist on my iPhone 3g my keyboard stops working in every app that needs the keyboard, anybody know why ?

    (webmaster@everythingberry.net)
    tks, rb.

  15. Kramer

    Sweet tutorial!

    Thanks a lot.

  16. flying sheep

    use this for plist conversion:
    http://iappcat.com/plist/bin2xml

    all other links are dead ;(
    poor ones…

  17. ram

    thanx dude, it is really working, thank you very much.

  18. TeluguFont

    Can we add support for a new language like Telugu using Gautami fonts that come with Windows XP?
    If you could comment on this that would be great.

  19. {Important|Valuable} {gift|info} for {anybody|anyone} who {needs|wants} {one way backlinks|backlinks} for no {charge|cost}. {Anyone|Anybody} {need|want} free {one way backlinks|backlinks} for their {blog|webite}? I {thought|figured} I {might|would} {share

    Valuable gift for anyone who needs one way backlinks for no charge. Anybody want free backlinks for their webite? I figured I would share some good information I discovered a little while ago. Free one way backlinks for your website. I have been using this for my websites and it absolutely works great! Click my name to get what I mean. Not peddling a thing, it’s completely free of charge and it works.

  20. Sameer

    can we use de nagri font

  21. Shashidhar

    Hi Gaurav,
    I’ve iphone 3gs 32GB factory unlocked with latest firmware & baseband, jailbroken with blackrain. I’m using PDF reader, Goodreader & Quickoffice to read word & pdf documents. Many of pdf files are in Kannada fonts and when i open these files it will not display the original alphabets of Kannada. Is it possible to install Kannada fonts in my iphone so that I can read my pdf files correctly. Thanx in advance.
    shashi

  22. Internet Banking

    @Markus I get your drift on where you were going there. I often think of my past and use it as a means to analyze where I am and where I want to get to. Where I struggel is balancing it all out. How do you guys balance things out?

  23. Faustino Niederer

    Apple now has Rhapsody as an app, which is a great start, but it is currently hampered by the inability to store locally on your iPod, and has a dismal 64kbps bit rate. If this changes, then it will somewhat negate this advantage for the Zune, but the 10 songs per month will still be a big plus in Zune Pass’ favor. Have you tried the ipad? you can get one free at FreshGiftCard.com

  24. Hennrik H. Hannsen

    Howdy How is it going today? It’s just that i enjoy your website so much, and that i believe you can start making a bunch of money from it. I have a few thriving websites that I started bringing in some cash from lately. They use a thing called a content revealer widget, that makes visitors fill out a small quiz inorder to get access to highly valued content or to download programs or tools that they want. And every time they do a easy survey i make around two dollars. Really awsome eh? Been earning alot more from this than adsense! Feel free to contact me, or you can check it out through my refferal link. tinyurl.com/yevwfst, Kind Regards, Hennrik H. Hannsen

  25. Free iPhone 4G

    Great reading, thank you

  26. Foods That Get Rid Of Gout

    Thank you for one more great article. Exactly where else could any individual get that form of details in such a ideal way of writing? I’ve a presentation next week, and I’m about the glance for such details.

  27. Shawn

    Super-Duper site! I am loving it!! Will come back again – I enjoy learning more about non profits, Thanks.

  28. virking

    is that possible to add Unicode Fonts in this way?

    I try adding Unicode Fonts but it doesn’t work…

    Could you help me on this?

  29. Pdf To Word Converter Freeware

    Fine website, in which did you come up with the info in this piece? I¡¯m pleased I uncovered it though, ill be checking back quickly to find out what other content articles you might have.

Leave a Reply

Looking for something?

Use the form below to search the site:

Still not finding what you're looking for? Drop a comment on a post or contact us so we can take care of it!

Visit our friends!

A few highly recommended friends...