∅ the empty set

How to use Font Awesome in a Desktop app

Font Awesome is the iconic font designed for use with Twitter Bootstrap. With over 200 icons in a single collection, Font Awesome is a pictographic language of web-related actions.

I recently run into the situation where I had to use a character in a desktop app. So I installed the font in Font Book and tried to map out the character-glyph correspondance.

font_awesome_font_book.png

It turns out that Font Awesome uses the Unicode Private Use Area to make sure screen readers don't read the characters off, but this makes it difficult to figure out which characters are associated with the glyphs.

font_awesome_ai_type_preferences.png

Here is how to get the font work in Adobe's CS:

  1. install the font by dragging it to Font Book
  2. open your favourite Adobe CS app and navigate to the "Preferences > Type…”
  3. uncheck “Enable missing glyph protection”
  4. use @parkerault correspondance sheet to copy and paste the characters your are interested in.

Et voilà.

Ø permalink: https://davidroessli.com/logs/2012/11/how_to_use_font_awesome_in_a_d/


Reponses to “How to use Font Awesome in a Desktop app”

#1 by Dave Horn

01:06 on 6 December 2012

Hi there,

I'm having no luck seeing the entire fontset in Adobe InDesign CS6, Mac (OS 10.6.8). No 'Enable Glyph Protection' setting exists. I can see a small subset of the fontset in both Fontbook and InDesign's Glyph palette.

What have I overlooked?

Cheers,

-dave^h.

#2 by David Roessli

11:59 on 6 December 2012

Dave,

I found this on Adobe's website:

http://helpx.adobe.com/mena/using/arabic-hebrew.html#id_39921

Legacy font support
Available in InDesign CS6, Illustrator CS6, Photoshop CS6

Fonts that have been traditionally used (for example, AXT fonts) can continue to be used in this release of the software. However, it is recommended that newer Open Type fonts be used for text-based elements.

Missing Glyph Protection (Edit > Preferences > Advanced Type) is enabled by default. Text is handled automatically, where glyphs are not available in the font you are using.

#3 by David Roessli

13:44 on 16 April 2013

Things have changed with version 3! Font Awesome comes with an OTF version and Copy & Paste page for easy reference!

#4 by David Roessli

16:23 on 11 November 2014

Apparently, Pages v5.5.1 doesn't render v4.2 of Font Awesome correctly. It's okay on screen, but when you print of generate a PDF, the characters come out much smaller.

This can be fixed by using the TrueType (TTF) version of the font instead of the OTF - not ideal, but it works…

Post a comment

(If you haven't left a comment here before, you may need to be approved by the site owner before your comment will appear. Until then, it won't appear on the entry. Thanks for waiting.)



Previous: Why my border-image didn't display in Firefox 15

Next: Long overdue


About

Hello, my name is David Roessli. I am a freelance web designer and developer based in Geneva, Switzerland.

This weblog is an nth attempt to solve my multiple online personalities and weblog/rss feeds burnout issues. (more)

Words

I have been contemplating the idea of upgrading my desktop Mac since this spring. The latest 27" iMac (Quad-Core) seemed the perfect candidate, but the release of Apple's 27" Monitor last September made me stick with the Mac Pro...

Music

The autopsy of an iconic album cover picked up on Kottke.org. A stacked graph of successive radio signals from pulsar CP 1919, in a 1977 astronomy encyclopedia that originated in a 1970 Ph.D. thesis. Fascinating <3...

Pictures

Check out my latest Flickr ramblings. Mostly day to day cameraphone pictures stolen here and there.


© 2000-2016 David Roessli | v4.1 | as valid xhtml and css as possible | hosted by pair Networks | RSS feeds.