web-dev-qa-db-ja.com

複数のクラスを持つwp_nav_menu（）

私はwp_nav_menu()でメニューを作ろうとしています。複数のクラスを追加しようとしていますが、これに関する経験がありません。クラスを上書きする必要があると思いますが...

<div class="top-menu">
<ul class="nav_menu">        
    <li class="nav_menu-item"><a href="javascript:void(0)" class="nav-p">PRODUCTS</a>
    <!-- ... -->
    </li>
    <li class="nav_menu-item"><a href="javascript:void(0)" class="nav-n">NEW</a>
        <ul class="nav_submenu">
        <!-- ... -->
        </ul>
    </li>
    <li class="nav_menu-item">
    <!-- ... -->
    </li>
    <li class="nav_menu-item">
    <!-- ... -->
    </li>
</ul>

コードを手伝ってもらえますか。

menusnavigationsub-menu
1
siad

私はあなたが探しているフックによってあなたの条件がそれぞれのクラスにどうであるかわかりません nav_menu_css_class 。これを使ってクラスを追加したり、メニューの各リスト項目<li>からクラスを削除することができます。

/**
 * Modify list item classes of wp_nav_menu
 * - https://codex.wordpress.org/Plugin_API/Filter_Reference/nav_menu_css_class
 * - https://developer.wordpress.org/reference/hooks/nav_menu_css_class/
 *
 * @param Array $classes || List of list-item classes
 * @param WP_Nav_Item Object $item || The Nav Menu Object, NOT the WP_Post object
 *
 * @return Array $classes
 */
function my_special_nav_class( $classes, $item ) {

    $menu_to_test_against = 'MENU NAME HERE';

    // Ensure we only apply this filter on the menu of our choice
    if( ! has_term( $menu_to_test_against, 'nav_menu', $item ) ) {
        return $classes;
    }

    $classes[] = 'nav-p';
    $classes[] = 'nav-n';

    return $classes;
}
add_filter( 'nav_menu_css_class', 'my_special_nav_class', 10, 2 );
1
Howdy_McGee