I'm trying to modify a non-WP theme to be compatible with my newest WP project, and one of the issues is a drop-down menu item. Since it's a totally custom theme, I want to replicate the behavior of this template 1:1, I require that the "Categories" nav menu item have the class "dropdown" included in it. I could use JavaScript to catch the ID and put a class name on it, but what if the ID changes later on?

Using PHP, how can I insert the class on a single menu item?


  • 1
    You'll probably need to create a Walker for this: wordpress.stackexchange.com/questions/14037/…
    – vancoder
    Aug 6, 2013 at 23:15
  • Seems powerful. Is it possible to create an entire drop down menu in this way? The drop-down I'm using requires a nested <ul>
    – Jon Mitten
    Aug 6, 2013 at 23:50
  • You can do whatever you want within the Walker class. WP's custom menu system wraps submenus in ul tags automatically, so you might want to create the bare bones of the menu there, then customize it using the walker.
    – vancoder
    Aug 6, 2013 at 23:52
  • I'm not seeing how to make adjustments on an individual basis. It seems like all the examples I'm looking at are affecting all element nodes of the menu equally. Any good resource to affect specific menu items?
    – Jon Mitten
    Aug 7, 2013 at 5:00

3 Answers 3


In the Appearance > Menus panel, you can expose custom class fields by clicking the "Screen Options" tab at the top of the page. From there, each menu item will have a custom css field labeled "CSS Classes (optional)" where an admin can put any plain text class name.


You can use the nav_menu_css_class filter to target the category items:

add_filter('nav_menu_css_class', 'custom_nav_menu_css_class', 10, 2 );
function custom_nav_menu_css_class( $classes, $item ) {
    if( 'category' === $item->object ){
        array_push( $classes, 'dropdown' ); 
    return $classes;    

and append the dropdown class.

  • and then, how do I go about wrapping the drop-items? the drop down items are the names of categories, and in the nav_menu, are grouped (visually) below the categories menu. In order for them to match this template exactly, they need to be wrapped inside a <div> and their own separate <ul>.
    – Jon Mitten
    Aug 7, 2013 at 15:10
  • 1
    howto wrap particular nav items with div/ul tags - might be better served as a new question with some html structure examples ;-)
    – birgire
    Aug 7, 2013 at 16:41

You can use the wp_nav_menu_objects filter:

add_filter( 'wp_nav_menu_objects', 'add_nav_menu_item_class' );

function add_nav_menu_item_class( $items ) {
    foreach ( $items as $item ) {
        $item->classes[] = 'css-class-name';
    return $items;

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.