How To Add a Custom CSS Class To Navigation Menus in WordPress

If you want to add a custom class to your navigation menus, you can either edit your theme’s code in every place where a menu is displayed or you can add a filter function to the nav_menu_css_class filter.

The nav_menu_css_class filter is called before the CSS classes are added to a navigation menu. This filter lets you modify the classes that will be added.

To add the custom class to wp_nav_menu, add this code to your theme’s functions.php file or a custom plugin:

function custom_nav_class($classes, $item){
     $classes[] = ‘my_custom_nav_menu_class’;
     return $classes;
}
add_filter(‘nav_menu_css_class’ , ‘custom_nav_class’ , 10 , 2);

The above code adds a filter function to the nav_menu_css_class filter. The filter function will add a new CSS class called my_custom_nav_menu_class to all the menus on your website.

Replace my_custom_nav_menu_class with whatever CSS class name you prefer.