I am an independent WordPress web consultant with 10 years of experience in WordPress theme installation, customization, administration, maintenance, support, documentation, troubleshooting and PSD/design to WP.
Hi Sridhar
I was wondering how your method differs to installing the fontawesome plugin in WordPress. It seems that the icon names are different between those in the plugin and those that are in the css file that your method uses:
I’ve got it working using the plugin. One advantage is that you can include icons in posts by using the TinyMCE plugin. The effect of this is to include a dropdown menu of icons in the post editor. Further info is at: http://wordpress.org/plugins/font-awesome/
Thank you very much for your wonderful and helpful tutorials. You are making me break some borders when it comes trying to do things on my own. Now, I followed this tutorial as well, and everything works well, until I try to change the font-awesome icon…then the circle go black. I have tried several things to make other icons appear, but with no success. Any clue?
Hi Sridhar, thank you for all the help you provide on this blog! It is filled with value 🙂
I figured out the last question, so you don’t need to spend time to answer…
I have another question about this tutorial: how would you write the css. if you would use this tutorial for Minimum Pro?
I have done everything you showed, but I have some problem in making it work in Minimum Pro. Your tut was for Parallax, I know and I tried to change the code to fit in Minimum, but without any luck.
In vitae ultricies lectus, non accumsan purus. Etiam ut vulputate risus, vitae tempor libero. Nulla id congue lacus, ac imperdiet nulla. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
Hi Sridhar
I was wondering how your method differs to installing the fontawesome plugin in WordPress. It seems that the icon names are different between those in the plugin and those that are in the css file that your method uses:
netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css
Thanks, Stuart
Stuart, I am not familiar with that plugin. I just load Font Awesome’s CSS using the enqueue method when needed.
I’ve got it working using the plugin. One advantage is that you can include icons in posts by using the TinyMCE plugin. The effect of this is to include a dropdown menu of icons in the post editor. Further info is at: http://wordpress.org/plugins/font-awesome/
Best wishes, Stuart
Thank you very much for your wonderful and helpful tutorials. You are making me break some borders when it comes trying to do things on my own. Now, I followed this tutorial as well, and everything works well, until I try to change the font-awesome icon…then the circle go black. I have tried several things to make other icons appear, but with no success. Any clue?
Thanks
Alright, I have the same issue when attempting to replace the icon. Black circle. What did you figure out to make it work Ingebjorg?
Yes I am trying to replace the icons as well, but only certain icons will work. I would like to know as well how you figured this out.
Hi Sridhar, thank you for all the help you provide on this blog! It is filled with value 🙂
I figured out the last question, so you don’t need to spend time to answer…
I have another question about this tutorial: how would you write the css. if you would use this tutorial for Minimum Pro?
I have done everything you showed, but I have some problem in making it work in Minimum Pro. Your tut was for Parallax, I know and I tried to change the code to fit in Minimum, but without any luck.
Best regards
Ingebjørg
You should change line 5 of the functions.php because there is a newer version of the font awesome! If you don’t do this not all icons will show.
wp_enqueue_style( ‘font-awesome’, ‘//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css’ );
into
wp_enqueue_style( ‘font-awesome’, ‘//netdna.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.css’ );
Quick question: how do you add links to the icons? I can’t seem to find a way to do it
Thanks
Hi Daniel, Where it says you can place the link instead of the #.
In vitae ultricies lectus, non accumsan purus. Etiam ut vulputate risus, vitae tempor libero. Nulla id congue lacus, ac imperdiet nulla. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.