मैं wp_nav_menu के लिए एक स्वनिर्धारित वॉकर वर्ग लिख रहा हूं और निर्दिष्ट करना चाहता हूं कि क्या कोई ली में सबमेनू शामिल है। इसलिए मैं चाहता हूं कि मेरा मार्कअप हो:
<li class="has_children [other-wordpress-classes]">
<a class="parent-link">Some item</a>
<ul class="sub-menu">मुझे पता है कि कक्षाओं को जोड़ना और निकालना कैसे ठीक है, मुझे सिर्फ यह बताने के लिए कुछ भी नहीं मिल रहा है कि क्या वर्तमान वस्तु में बच्चे हैं।
कोई विचार?
अग्रिम में धन्यवाद।
जवाबों:
start_el()यह जानकारी इसके $argsपैरामीटर में मिलनी चाहिए , लेकिन ऐसा प्रतीत होता है कि वर्डप्रेस केवल$args इसे भरता है यदि यह एक सरणी है , जबकि कस्टम नेविगेशन मेनू के लिए यह एक वस्तु है। यह एक Trac टिकट में बताया गया है । लेकिन कोई समस्या नहीं है, आप इसे अपने आप में भर सकते हैं, यदि आप display_element()अपने कस्टम वॉकर में विधि को ओवरराइड करते हैं (क्योंकि यह बाल तत्व सरणी तक पहुंचने का सबसे आसान स्थान है):
class WPSE16818_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 ) {
// ...
}
}अद्यतन: वर्डप्रेस 3.7 के रूप में - एक कस्टम वॉकर का उपयोग करने के रूप में यह वर्डप्रेस कोर में का ध्यान रखा है कोई जरूरत (अक्टूबर 2013), सीएसएस वर्गों विषय मेनू में बच्चे मेनू आइटम और पृष्ठों इंगित करने के लिए जोड़ा गया है।
CSS क्लासेस का नाम menu-item-has-childrenऔर है page_item_has_children।
जल्दी में किसी के लिए एक पूर्ण समाधान के लिए (जान फेब्री के पिछले जवाब के लिए क्रेडिट), नीचे पूर्ण कार्यान्वयन देखें।
अपने थीम के टेम्प्लेट में नेविगेशन को आउटपुट करें:
wp_nav_menu( array(
'theme_location' => 'navigation-primary',
'container' => false,
'container_class' => '',
'container_id' => '',
'menu_class' => '',
'menu_id' => '',
'walker' => new Selective_Walker(),
'depth' => 2
)
);फिर, अपने विषय में निम्नलिखित शामिल करें 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);
}
}परिणामी HTML आउटपुट निम्न सदृश होगा:
<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>वर्डप्रेस के वॉकर क्लास का उपयोग करने के बारे में अधिक जानकारी के लिए, वॉकर क्लास को समझें ।
का आनंद लें!
यह फ़ंक्शन ठीक वही है जो आप करना चाहते हैं। यह आपको नव मेनू आइटम को संशोधित करने का एक बहुत प्रभावी तरीका भी दिखाता है। इसके अलावा आप इसे आइटम के माध्यम से और अधिक उन्नत (उदाहरण के लिए चाइल्ड थीम) कार्यों के लिए खोल सकते हैं:
/**
* Classes for a navigation named "Topnav" in the nav location "top".
* Shows examples on how to modify the current nav menu item
*
* @param (object) $items
* @param (object) $menu
* @param (object) $args
*/
function wpse16818_nav_menu_items( $items, $menu, $args )
{
# >>>> start editing
// examples for possible targets
$target['name'] = 'Topnav';
// The targeted menu item/s
$target['items'] = array( (int) 6 );
# <<<< stop editing
// filter for child themes: "config_nav_menu_topnav"
$target = apply_filters( 'config_nav_menu_'.strtolower( $target['name'] ), $target );
// Abort if we're not with the named menu
if ( $menu->name !== $target['name'] )
return;
foreach ( $items as $item )
{
// Check what $item contains
echo '<pre>'; print_r($item); echo '</pre>';
// First real world example:
$item->classes = 'span-4';
// Second real world example:
// Append this class if we are in one of the targeted items
if ( in_array( (int) $item->menu_order, $target['items'] ) )
$item->classes .= ' last';
}
return $items;
}
add_filter( 'wp_get_nav_menu_items', 'wpse16818_nav_menu_items', 10, 3 );और हाँ, लगभग हर मामले में - कस्टम वॉकर की कोई आवश्यकता नहीं है।
यदि आप ड्रॉप डाउन बनाना चाहते हैं, तो आप इसे केवल सीएसएस के साथ कर सकते हैं। बच्चों के साथ WP में कस्टम नेवी बनाते हैं, वर्डप्रेस अपने आप ही बच्चे को उल्टा क्लास .sub-menu असाइन करता है। इस सीएसएस की कोशिश करो
nav li {position:relative;}
.sub-menu {display:none; position:absolute; width:300px;}
nav ul li:hover ul {display:block;}आप इसे थोड़ा ऊपर मसाला देने के लिए कुछ jQuery जोड़ना चाहते हैं, लेकिन यह आपको एक काम कर ड्रॉप डाउन मेनू देना चाहिए।
if ( $this->has_children ) {
$item_output .= 'has_children';
}