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 used this technique when I built a website on a temp URL and the down icons worked fine. I then changed the NS of the real domain to point at the site when it was finished and I am getting the numbers from the css instead. I have tried flushing the caches on my browsers and nothing is making it go back to the icons. Do you have any idea what could cause this?
OK, so I tried it out again on a different site. Here is what happened.
1. I added your code to Genesis Extender initially and it worked fine.
2. I updated the Genesis Extender plugin and I saw the css numbers instead of the arrows. e.g. F107
3. I uninstalled the Genesis Extender plugin and added the code to the Genesis Sample theme files. It still showed the numbers.
4. I reinstalled the Genesis Extender plugin (1.3) and entered your code in Extender again but I did not open the Front end CSS editor and the arrows worked again.
5. I then activated the front end css builder and the number appeared in place of the arrows.
My conclusion is that Genesis Extender seems to affect your code. I use Genesis Extender a lot and wondered if there was a way to solve this issue? Your tutorial is fantastic and I would like to be able to use font awesome icons in the navigation.
[…] Update on December 25, 2013: From my personal experience and that of a blog reader, entypo fonts do not always seem to appear in all the browsers. Therefore I wrote an updated tutorial where Font Awesome font icons can be used instead. Follow http://www.sridharkatakam.com/adding-nav-sub-menu-indicators-genesis-using-font-awesome/. […]
Flawless. Thank you 🙂 You are really a magician!!
[…] Adding nav sub menu indicators in Genesis using Font Awesome […]
[…] Adding nav sub menu indicators in Genesis using Font Awesome […]
Hi Sridhar. I used this technique when I built a website on a temp URL and the down icons worked fine. I then changed the NS of the real domain to point at the site when it was finished and I am getting the numbers from the css instead. I have tried flushing the caches on my browsers and nothing is making it go back to the icons. Do you have any idea what could cause this?
Sorry Sridhar, here is the domain: http://bhaktimarga.co.uk/
My client needs the website working, so I have removed the code. I will try this again on a different site.
If you can give me the site URL again showing the problem, I shall take a look.
OK, so I tried it out again on a different site. Here is what happened.
1. I added your code to Genesis Extender initially and it worked fine.
2. I updated the Genesis Extender plugin and I saw the css numbers instead of the arrows. e.g. F107
3. I uninstalled the Genesis Extender plugin and added the code to the Genesis Sample theme files. It still showed the numbers.
4. I reinstalled the Genesis Extender plugin (1.3) and entered your code in Extender again but I did not open the Front end CSS editor and the arrows worked again.
5. I then activated the front end css builder and the number appeared in place of the arrows.
My conclusion is that Genesis Extender seems to affect your code. I use Genesis Extender a lot and wondered if there was a way to solve this issue? Your tutorial is fantastic and I would like to be able to use font awesome icons in the navigation.
Any feedback would be great – Seb
Sorry, here is the URL of the test site: http://151.252.1.90/~jqueryse/
Don’t worry about this Sridhar. I found a solution using this plugin: http://www.newnine.com/plugins/font-awesome-4-menus. Keep up the nice articles, they are very helpful.
Hi Sridhar,
Great tutorial as always, thanks!
Say, have you found any significant performance decrease when using a lot of Font Awesome stuff?
Thanks, Dave
Great Sridhar! Thanks for this code.
[…] http://www.sridharkatakam.com/adding-nav-sub-menu-indicators-genesis-using-font-awesome/ […]