Güncelleme: itibarıyla WordPress 3.7 - bu WordPress çekirdek bakıldığından gibi özel bir yürüteç kullanmak gerek (Ekim 2013), CSS sınıfları tema menülerde alt menü öğeleri ve sayfalarını belirtmek için eklenmiştir.
CSS sınıfları menu-item-has-children
ve olarak adlandırılır page_item_has_children
.
Acelesi olan herkes için tam bir çözüm için (Jan Fabry'nin önceki cevabına verilen kredi), aşağıdaki tam uygulamaya bakın.
Gezintiyi kendi şablonunuzda yayınlayın:
wp_nav_menu( array(
'theme_location' => 'navigation-primary',
'container' => false,
'container_class' => '',
'container_id' => '',
'menu_class' => '',
'menu_id' => '',
'walker' => new Selective_Walker(),
'depth' => 2
)
);
Ardından, temanıza aşağıdakileri ekleyin functions.php
:
class Selective_Walker extends Walker_Nav_Menu {
function display_element( $element, &$children_elements, $max_depth, $depth=0, $args, &$output ) {
$id_field = $this->db_fields['id'];
if ( is_object( $args[0] ) ) {
$args[0]->has_children = !empty( $children_elements[$element->$id_field] );
}
return parent::display_element( $element, $children_elements, $max_depth, $depth, $args, $output );
}
function start_el( &$output, $item, $depth, $args ) {
if ( $args->has_children ) {
$item->classes[] = 'has_children';
}
parent::start_el(&$output, $item, $depth, $args);
}
}
Sonuçta ortaya çıkan HTML çıktısı aşağıdakine benzer:
<ul>
<li><a href="#">Home</a></li>
<li class="has_children"><a href="#">About</a>
<ul class="sub-menu">
<li><a href="#">Our Mission</a></li>
</ul>
</li>
<li><a href="#">Services</a></li>
<li class="has_children"><a href="#">Products</a>
<ul class="sub-menu">
<li><a href="#">Lorem Ipsum</a></li>
<li><a href="#">Lorem Ipsum</a></li>
</ul>
</li>
<li><a href="#">Contact Us</a></li>
</ul>
WordPress'in yürüteç sınıfını kullanma hakkında daha fazla bilgi için, bkz . Walker Sınıfını Anlama .
Keyfini çıkarın!