it-swarm.com.de

Klasse zum Menüelement der obersten Ebene hinzufügen, wenn es mehrere untergeordnete Ebenen hat

Ich habe ein WP Navigationsmenü, und ich muss jedem <li> der obersten Ebene eine Klasse hinzufügen, wenn dieses Element mehr als eine Ebene von untergeordneten Elementen enthält (dh, sein untergeordnetes Untermenü verfügt auch über ein Untermenü). So was:

<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>

Ich gehe davon aus, dass ich einen Walker verwenden muss, um dies zu erreichen. (Ich möchte die Klasse nicht manuell in den WP Menüeinstellungen hinzufügen.) Ich habe versucht, mit einigen Beispielwanderern zu arbeiten, die ich gefunden habe, aber ich konnte die Klasse nicht in die hinzufügen Ahnengegenstand der Stufe 0. Vielen Dank für jede Hilfe!

4
LBF

Nicht sicher, aber vielleicht funktioniert so etwas? Ergänzen Sie die functions.php. Siehe Erklärung hier .

//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' ); 

Wenn Sie also Jquery verwenden können, können Sie dies folgendermaßen tun:

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