html - 如何在wordpress wp_nav函数中包装子菜单

Question

我是 wordpress 的新手，如果有人能帮助我，我会很有帮助，我设计了一个使用 bootstrap 框架的网站，为了使它成为 CMS，我正在使用 wordpress。我需要使用以下代码从我用餐的 wordpress 动态获取菜单

<?php wp_nav_menu(array('menu_class' => 'nav nav-justified','container_class' => 'menu_bac')); ?>

但我遇到的问题是动态获取子菜单，有人建议我使用 navwalker ，但不知道如何将它添加到我自己的代码中。谁能帮帮我

Answer 1

您需要将您的代码放入您的 function.php 文件中，该文件位于您的主题文件夹中。实现以下代码以扩展 Walker_Nav_Menu 类，并根据您的要求放置自定义代码。

class Custom_Menu extends Walker_Nav_Menu {

        public function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {

                $indent = ( $depth ) ? str_repeat( "\t", $depth ) : '';

        $classes = empty( $item->classes ) ? array() : (array) $item->classes;
        $id = $id ? ' id="' . esc_attr( $id ) . '"' : '';

                //print_r($args);
                $children = get_posts(array('post_type' => 'nav_menu_item', 'nopaging' => true, 'numberposts' => 1, 'meta_key' => '_menu_item_menu_item_parent', 'meta_value' => $item->ID));
                if (empty($children)) {
                        $output .= $indent . '<li' . $id . $class_names .'>';                                       
                } else {
                    $output .= $indent . '<li class="dropdown">';                                       
                }               
        $atts = array();
        $atts['title']  = ! empty( $item->attr_title ) ? $item->attr_title : '';
        $atts['target'] = ! empty( $item->target )     ? $item->target     : '';
        $atts['rel']    = ! empty( $item->xfn )        ? $item->xfn        : '';
        $atts['href']   = ! empty( $item->url )        ? $item->url        : '';
        $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args );

        $attributes = '';
        foreach ( $atts as $attr => $value ) {
            if ( ! empty( $value ) ) {
                $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value );
                $attributes .= ' ' . $attr . '="' . $value . '"';
            }
        }
                if ($children) {
                    $item_output = $args->before;
                    $item_output .= '<a class="dropdown-toggle js-activated" data-toggle="dropdown" href="#">';                    
                    $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after;
                    $item_output .= '<b class="caret"></b>';
                    $item_output .= '</a>';                    
                    $item_output .= $args->after;
                } else {
                    $item_output = $args->before;
                    $item_output .= '<a'. $attributes .'>';
                    /** This filter is documented in wp-includes/post-template.php */
                    $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after;
                    $item_output .= '</a>';
                    $item_output .= $args->after;
                }

        $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args );
    }

        public function start_lvl( &$output, $depth = 0, $args = array() ) {
        $indent = str_repeat("\t", $depth);
        $output .= "\n$indent<ul class=\"dropdown-menu\">\n";
    }
}

将下面的代码放入您的 header.php 文件中

$defaults = array(
                        'theme_location' => 'primary',
                        'menu' => '',
                        'container' => 'div',
                        'container_class' => 'navbar-collapse collapse',
                        'container_id' => '',
                        'menu_class' => 'nav navbar-nav navbar-right',
                        'menu_id' => '',
                        'echo' => true,
                        'fallback_cb' => 'wp_page_menu',
                        'before' => '',
                        'after' => '',
                        'link_before' => '',
                        'link_after' => '',
                        'items_wrap' => '<ul id="%1$s" class="%2$s">%3$s</ul>',
                        'depth' => 0,
                        'walker' => new Custom_Menu
                    );
                    wp_nav_menu($defaults);