【WordPress】メニューのカテゴリーにclass名を追加する方法

・PHPで「menu-item-category-スラッグ名」を自動でclass追加する方法
・WPの管理画面から手動で追加する方法

PHPで自動でclass追加する方法

function add_slug_nav_menu_css_class( $classes, $item ) {
    switch ( $item->type ) {
    case 'post_type' :
        $post = get_post( $item->object_id );
        if ( $post ) {
            $classes[] = esc_attr( 'menu-item-' . $item->object . '-' . $post->post_name );
        }
        break;
    case 'taxonomy' :
        $term = get_term( $item->object_id, $item->object );
        if ( $term ) {
            $classes[] = esc_attr( 'menu-item-' . $item->object . '-' . $term->slug );
        }
        break;
    default :
    }
    $classes = array_unique( $classes );
    return $classes;
}
add_filter( 'nav_menu_css_class', 'add_slug_nav_menu_css_class', 10, 2 );

「case 'post_type' :」の部分が、固定ページで、
「case 'taxonomy' :」の部分が、カテゴリです。

上記をテーマの「functions.php」に追記します。
2011年頃のブログ記事でも紹介されているのでかなり古くからある手法のようです。

ソースは、参考にしたところそのままです。
「nav_menu_css_class」で検索するといろいろ出てくるかと思います。

参考：
・ナビゲーションメニューのclassにページやカテゴリーのスラッグを追加してみる | Simple Colors
・Adding category ID or slug to WP Nav Menu - WordPress Development Stack Exchange

WPの管理画面から手動で追加する方法

「外観」-＞「メニュー」のところでも実はclass名を追加できます。


画面の右上の「表示オプション」を開くと、上記のようなオプションが現れるので、「CSS クラス」にチェックをいれます。


そうすると、CSS class (オプション)という項目がでてくるので、そこに入力するだけでOKです。