Add class on li using wp_nav_menu()
Sometimes when we are implementing our menu in front-end using wp_nav_menu() function, we need to modify it in different way. Here we are discussing about adding class in each li comes under the ul.
For example we are having this structure to implement :
<ul> <li class="test_class">your value 1</li> <li class="test_class">your value 2</li> <li class="test_class">your value 3</li> <li class="test_class">your value 4</li> <li class="test_class">your value 5</li> </ul>
To implement above html in exact way we need to write :
<?php wp_nav_menu( array('menu' => 'your_menu_name','container'=> '','items_wrap'=>'<ul>%3$s</ul>')); ?>
And put the below mentioned code in your function.php file to add class in your each li :
<?php function add_classes_on_li($classes, $item, $args) { $classes[] = 'test_class'; return $classes; } add_filter('nav_menu_css_class','add_classes_on_li',1,3); ?>
In this way your class “test_class” will be in all of your li in output.
That’s great, thanks, but can you please explain the …,1,3) are they priorities or what?
yes they are the priorities of calling a default wordpress hook that is “nav_menu_css_class”
Its really good information. I used it in my wordpress menu configuration. Thanks.