Font Awesome Icons WordPress Plugin
Font Awesome is my favorite of the free font icon sets. All of the 220 pixel perfect icons are well designed, have great cross-browser support and are easy to use.
I am using the Font Awesome icon set to display the social icons to the header area of this site. I wanted to be able to use the icons without having to rely on my current theme, so I created a simple WordPress plugin.
The Font Awesome Icons plugin adds the Font Awesome font and necessary styles to any WordPress site. The plugin is available to download from the WordPress plugin repository or from my Github account.
Update October 7, 2012:
The plugin is no longer available from the WordPress plugin repository, but it is still available for download from it’s Github repository.
Usage Instructions
To use any of the Font Awesome icons on your WordPress site you have two options:
1. HTML Option
All code examples on the Font Awesome site apply: http://fortawesome.github.com/Font-Awesome/#code
Examples:
<i class="icon-pencil"></i><i class="icon-phone"></i><i class="icon-chevron-left"></i>2. Shortcode Option
Don’t want to worry about HTML tags? You can use a shortcode in your posts, pages and even widgets to display a Font Awesome icon.
The shortcode to use is , where name=X is the class of the icon you would like to use.
Examples:
[icon name=icon-pencil][icon name=icon-phone][icon name=icon-chevron-left]Full Icons Set
Patrick Rauland
I’ve actually had some problems rendering all 200+ glyphs on my local machine. Another designer in the agency had the same problem. You haven’t had any problems with this font set?
rachelbaker Post author
Patrick,
What browser has been causing your problems? I know there was an issue with IE9 rendering (see discussion here: https://github.com/FortAwesome/Font-Awesome/issues/374#issuecomment-7737990), but that was the only problem I have seen. In my plugin I include the fix for the IE9 display issue, that is patched in this pull request: https://github.com/FortAwesome/Font-Awesome/pull/439
Patrick Rauland
Wow…sorry for the LATE reply. I must have missed the notification. We didn’t get as far as the browser. On our local machines they were only showing us a handful of glyphs. So far your plugin has worked perfectly.
Chetan
Hi!
Thank you for creating the amazing font awesome plugin. I’m using them on 320press wordpress theme based on bootstrap. The icons are appearing a bit funny and I don’t understand why.
http://projectcloud.info/journal-call-for-papers/campus-law-centre-student-law-review-volume-i-issue-i/
You can see the icons below the title.
I’d be grateful for your input.
Thank You!
Chetan
Hi!
In addition to my earlier comment, if I remove the plugin, I can see some of the icons that come with the theme. When the plugin is active, I see two icons superimposed on each other.
Thanks!
Alain Balet
A BIG Thank you for your Excellent “Font Awesome Icons WordPress Plugin”.
In a next update would it be possible to add the following icons :
- mobile phone icon (1 BlackBerry, 1 iPhone, 1 Androïde, 1 NoName – as not jealous)
- PC/Mac screen icon
- fax icon
I think these icons are widely used today.
Thanks again (and sorry for my bad english)
Primoz
Hi!
Nice plugin! Is there a particular reason why the plugin isn’t in the WP repository anymore? If I were to use it with a theme for sell on TF, it would be nice I could recommend a WP repo plugin (for simpler installation + auto updates).
Tom H.
Great plugin, thank you for sharing this! I was having one issue with it though. I noticed if I add the HTML or shortcode in the text view within the WordPress visual editor and save the page and preview it, the icons display fine. However, if I jump over to the Visual tab and make any edits and save then preview the page, the icons stop displaying. When I go back to the text view, the HTML or shortcode is still there and intact, it just won’t work anymore for some reason.
Joshua @Contribee
Rachel!
Thanks for another great pluggin. I know this comment is similar to all of spam bots that say your content is amazing. But really, it is. Your WordPress/Bootstrap tools rock my world!
Zulfikar Nore
Another great Bootstrap addition for WordPress Rachel. I’ve only just recently got started with Bootstrap and love it. Already created my first theme (with many to come) and your plugin inspired me to put one of my own together.
Since you have already done one for Font Awesome I opted for the Elusive Iconfont set by Aristath which has about 270+ icon (similar to Font Awesome) but for the licensing aspect of it.
hope you don’t mind me sharing it here (its Free and on GitHub) >> https://github.com/zulfnore/wp-elusive-iconfont
Now to go work on your BootstrapWP theme and see what I can do with it