問題描述

可以在 wp_nav_menu 菜單的輸出中添加類別的 id 或 slug 嗎?

例如,wp_nav_menu 的標準輸出是:

<div class="menu-header">
    <ul id="menu-categorieen" class="menu">
        <li id="menu-item-4353" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-4353"><a href="http://domain/">Home</a></li>
        <li id="menu-item-1034" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1034"><a href="http://domain/category/category_1/">Category 1</a></li>
        <li id="menu-item-1039" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1039"><a href="http://domain/category/category_2/">Category 2</a></li>
        <li id="menu-item-1032" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1032"><a href="http://domain/category/category_3/">Category 3</a></li>
    </ul>
</div>

我想知道是否可以將類別插件添加到<li> 的 css 類,像這樣:

<div class="menu-header">
    <ul id="menu-categorieen" class="menu">
        <li id="menu-item-4353" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-4353"><a href="http://domain/">Home</a></li>
        <li id="menu-item-1034" class="menu-category-1 menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1034"><a href="http://domain/category/category_1/">Category 1</a></li>
        <li id="menu-item-1039" class="menu-category-2 menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1039"><a href="http://domain/category/category_2/">Category 2</a></li>
        <li id="menu-item-1032" class="menu-category-3 menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1032"><a href="http://domain/category/category_3/">Category 3</a></li>
    </ul>
</div>

最佳解決方案

使用 nav_menu_css_class 篩選器將類添加到 wp_nav_menu 輸出。

添加 ID(不需要額外的查詢):

function wpa_category_nav_class( $classes, $item ){
    if( 'category' == $item->object ){
        $classes[] = 'menu-category-' . $item->object_id;
    }
    return $classes;
}
add_filter( 'nav_menu_css_class', 'wpa_category_nav_class', 10, 2 );

添加 slug(通過 get_category 加載類別對象):

function wpa_category_nav_class( $classes, $item ){
    if( 'category' == $item->object ){
        $category = get_category( $item->object_id );
        $classes[] = 'menu-' . $category->slug;
    }
    return $classes;
}
add_filter( 'nav_menu_css_class', 'wpa_category_nav_class', 10, 2 );

參考文獻

注:本文內容整合自 Google/Baidu/Bing 輔助翻譯的英文資料結果。如果您對結果不滿意,可以加入我們改善翻譯效果:薇曉朵技術論壇。