Font Awesome

To add a Font Awesome icon to a menu item, open the Mega Menu settings for the menu item and click the ‘Menu Icon’ tab. You will see a list of available icon types listed across the top of the page. Select ‘Font Awesome’ select the icon you would like to use.

FontAwesome Icons

Troubleshooting

If the icons are not appearing on the front end, go to Mega Menu > Tools and clear the CSS cache (you will only need to do this once).

Equal Width Icons

Font Awesome icons are output at varying widths depending on the icon chosen. When displaying icons next to menu items in a vertical list, the varying with of the icons can make the menu item text appear as if it is not lined up correctly. To set a fixed width on the icons, go to Mega Menu > Menu Themes > Custom Styling and add the following:

Dequeueing Styles

Max Mega Menu will automatically include the required Font Awesome CSS on your site. If your theme already uses Font Awesome, you can stop Max Mega Menu from including a copy of the CSS by adding the following code to your themes functions.php file.

Like what you see? This functionality is available in Max Mega Menu Pro

Related Articles