Customize navigation menu is a new feature that gives you the ability to add elements that will give relief and interactivity to your menu by specifically pointing some of your entries that will quickly guide your users to recently modified pages/articles.
You can simply add a badge, an icon, an image or the thumbnail of the post.
These elements can be integrated into your menus while respecting the responsive design.
Enable navigation menu customization option
By default the feature is disabled. In the admin panel select EAC Components link WordPress tab then activate the option Customize nav menu and save settings.
Add a badge icon or image to menu items
To do this, go to ‘Appearance/Menus’, select the target menu and then unfold a menu item.
Click on the ‘Show fields’ button to open the popup and fill in the desired elements.
The content of the badge will be displayed after the title of the item and the other elements will be before.
Supported icon types
Dashicons (WordPress core icons).
Elegant icons font (By elegantthemes.com)
Fonts Awesome (By awesome.com v5) displayed by categories.
Filter the output
If you want to reuse your menu in a sidebar, footer widget or off-canvas menu from the distribution and you don’t want to display the newlies elements you added, you have to use this filter in your child theme’s functions.php file.
/** Sidebar */
add_filter( 'eac_menu_item_class', function( $classes ) {
$classes[] = 'hide-sidebar';
return $classes;
} );
/** Footer */
add_filter( 'eac_menu_item_class', function( $classes ) {
$classes[] = 'hide-footer';
return $classes;
} );
/** Off-canvas */
add_filter( 'eac_menu_item_class', function( $classes ) {
$classes[] = 'hide-canvas';
return $classes;
} );
Compatible themes
Customize Navigation Menu works with most of the themes out there, especially with popular ones like Twenty Seventeen, GeneratePress, OceanWP, WP Newspaper, Astra, Hueman…
Make sure that your active theme is using the default walker for displaying the nav menu.
If it’s using its own custom walker, make sure that the theme implements the nav_menu_item_title filter well (please consult your theme author about this).
For example, this is not the case for the theme Hestia which will not display the elements you have entered.