web-dev-qa-db-ja.com

複数の子レベルがある場合は、トップレベルメニュー項目にクラスを追加します

私はWP navメニューを持っています、そしてそのアイテムが1つ以上のレベルの子アイテムを持っている場合、私はクラスをトップレベルの<li>に追加する必要があります。このような:

<ul>
    <li>Parent
        <ul class="sub-menu">
            <li>Sublink1</li>
            <li>Sublink2</li>
        </ul>
    </li>
    <li>Parent</li>
    <li class="ADD-CLASS-HERE">Parent <!-- add class to this item -->
        <ul class="sub-menu">
            <li>Sublink1</li>
            <li>Sublink2</li>
            <li>Sublink3
                <ul class="sub-menu">
                    <li>Sublink1</li>
                    <li>Sublink2</li>
                </ul>
            </li>
        </ul>
    </li>
    <li>Parent</li>
    <li>Parent</li>
    <li>Parent
        <ul class="sub-menu">
            <li>Sublink1</li>
            <li>Sublink2</li>
        </ul>
    </li>
</ul>

私はこれを達成するためにウォーカーを使う必要があると思います。 (WPメニュー設定に手動でクラスを追加したくはありません。)私が見つけたウォーカーの例をいくつか試してみましたが、クラスを追加することができませんでしたレベル0の先祖アイテム助けてくれてありがとう!

4
LBF

よくわからないが、おそらくこのようなものでうまくいくだろうか? functions.phpに追加します。説明 ここ を参照してください。

//This function is responsible for adding "my-parent-item" class to parent menu item's
function add_menu_parent_class( $items ) {
$parents = array();
foreach ( $items as $item ) {
    //Check if the item is a parent item
    if ( $item->menu_item_parent && $item->menu_item_parent > 0 ) {
        $parents[] = $item->menu_item_parent;
    }
}

foreach ( $items as $item ) {
    if ( in_array( $item->ID, $parents ) ) {
        //Add "menu-parent-item" class to parents
        $item->classes[] = 'my-parent-item';
    }
}

return $items;
}

//add_menu_parent_class to menu
add_filter( 'wp_nav_menu_objects', 'add_menu_parent_class' ); 

あなたがJqueryを使用できるのであれば、あなたはこのようにすることができます:

$('ul li.menu-parent-item:has(ul ul)').addClass('your class');
3
Dejo Dekic