In early November, Font Awesome released a major update, Font Awesome 4.0. This change added only a few new icons, but completely changed all icons classes. This makes Font Awesome 4.0 not backwards compatible with Font Awesome 3.0.
However, I wanted to update the version of Font Awesome in UberMenu Icons to keep the plugin up to date with the latest font icons, and I wanted this to be as backwards compatible as possible. So I’ve developed an update for UberMenu Icons which should allow you to transition to Font Awesome 4 pretty seamlessly.
UberMenu Icons 1.1 now includes Font Awesome 4, and no longer includes Font Awesome 3. It includes a mapping from old icon classes to new icon classes so that they can be converted, however.
Update Instructions
When you are ready to update, follow the standard update instructions, and then complete the following steps to migrate your Font Awesome 3 icons to Font Awesome 4.
When you install UberMenu 1.1, your Font Awesome 3 assets will be replaced with Font Awesome 4 assets, so the icons on your site won’t appear (unless you have Font Awesome 3 elsewhere on your site). To immediately recover them:
1. Go to your UberMenu Control Panel > Icon Settings > Advanced Settings and enable Convert Font Awesome Version 3 Classes
After enabling and saving, your icons should reappear on the front end.
This converts all your icons from Font Awesome 3 to Font Awesome 4 on the fly at page load. This is a mildly expensive operation, so it’s better to also continue to step 2 to permanently convert the classes.
2. To permanently convert all of your icons to Font Awesome 4, just resave your menu*
*Before you do this, make sure your icons are still intact in the Menus Panel. Go to Appearance > Menus and check your icons on each menu item. If the icons are showing as expected, go ahead and save your menu. The icons shown here will be saved and overwrite any previous icons. I have tested this process and it works without issue, but better to be safe than sorry if something has gone wrong on your setup (worst case scenario, you’d lose your icons and have to reassign them to each menu item again). It’s always a good idea to make a backup before updating just in case
Once you’ve saved your menu, go back to your UberMenu Control Panel and disable the Convert Font Awesome Version 3 Classes, and your icons should still display properly on the front end.
Exceptions
Please note if you are using any of the following icons, you will need to manually update them (they will appear still after Step 1 above, but you’ll need to re-select them before saving in Step 2)
- icon-expand-alt
- icon-collapse-alt
- icon-star-half-empty