Question

我想将带子菜单的给定菜单更改为下拉菜单。

实际上它会在主菜单下面打开一个新行。您可以在此处的给定屏幕截图中看到。

我在代码中搜索了显示的css类nm-shop-sub-categories并找到了这个函数。类nm-shop-sub-categories位于函数的末尾。

/*
     *  Product category menu: Output
     */
    if ( ! function_exists( 'nm_category_menu_output' ) ) {
        function nm_category_menu_output( $is_category, $current_cat_id, $hide_empty ) {
            global $wp_query, $nm_theme_options;

            $page_id = wc_get_page_id( 'shop' );
            $page_url = get_permalink( $page_id );
            $hide_sub = true;
            $current_top_cat_id = null;
            $all_categories_class = '';

            // Is this a category page?                                                             
            if ( $is_category ) {
                $hide_sub = false;

                // Get current category's top-parent id
                $current_cat_parents = get_ancestors( $current_cat_id, 'product_cat' );
                if ( ! empty( $current_cat_parents ) ) {
                    $current_top_cat_id = end( $current_cat_parents ); // Get last item from array
                }

                // Get current category's direct children
                $current_cat_direct_children = get_terms( 'product_cat',
                    array(
                        'fields'        => 'ids',
                        'parent'        => $current_cat_id,
                        'hierarchical'  => true,
                        'hide_empty'    => $hide_empty
                    )
                );
                $category_has_children = ( empty( $current_cat_direct_children ) ) ? false : true;
            } else {
                // No current category, set "All" as current (if not product tag archive or search)
                if ( ! is_product_tag() && ! isset( $_REQUEST['s'] ) ) {
                    $all_categories_class = ' class="current-cat"';
                }
            }

            $output_cat = '<li' . $all_categories_class . '><a href="' . esc_url ( $page_url ) . '">' . esc_html__( 'All', 'nm-framework' ) . '</a></li>';
            $output_sub_cat = '';
            $output_current_sub_cat = '';

            // Categories order
            $orderby = 'slug';
            $order = 'asc';
            if ( isset( $nm_theme_options['shop_categories_orderby'] ) ) {
                $orderby = $nm_theme_options['shop_categories_orderby'];
                $order = $nm_theme_options['shop_categories_order'];
            }

            $categories = get_categories( array(
                'type'          => 'post',
                'orderby'       => $orderby, // Note: 'name' sorts by product category "menu/sort order"
                'order'         => $order,
                'hide_empty'    => $hide_empty,
                'hierarchical'  => 1,
                'taxonomy'      => 'product_cat'
            ) );

            // Categories menu divider
            $categories_menu_divider = apply_filters( 'nm_shop_categories_divider', '<span>&frasl;</span>' );

            foreach( $categories as $category ) {
                // Is this a sub-category?
                if ( $category->parent != '0' ) {
                    // Should sub-categories be included?
                    if ( $hide_sub ) {
                        continue; // Skip to next loop item
                    } else {
                        if ( 
                            $category->parent == $current_cat_id || // Include current sub-category's children
                            ! $category_has_children && $category->parent == $wp_query->queried_object->parent // Include categories with the same parent (if current sub-category doesn't have children)
                        ) {
                            $output_sub_cat .= nm_category_menu_create_list( $category, $current_cat_id, $categories_menu_divider );
                        } else if ( 
                            $category->term_id == $current_cat_id // Include current sub-category (save in a separate variable so it can be appended to the start of the category list)
                        ) {
                            $output_current_sub_cat = nm_category_menu_create_list( $category, $current_cat_id, $categories_menu_divider );
                        }
                    }
                } else {
                    $output_cat .= nm_category_menu_create_list( $category, $current_cat_id, $categories_menu_divider, $current_top_cat_id );
                }
            }

            if ( strlen( $output_sub_cat ) > 0 ) {
                $output_sub_cat = '<ul class="nm-shop-sub-categories">' . $output_current_sub_cat . $output_sub_cat . '</ul>';
            }

            $output = $output_cat . $output_sub_cat;

            echo $output;
        }
    }

是否可以重写该功能以生成下拉菜单而不是显示的菜单？正如你在屏幕截图中看到的css类

<ul class="nm-shop-sub-categories">
   <li>item_1</li>
   <li>item_2</li>
</ul>

不在父列表中。但我希望它像这样的结构：

<ul class="nm-shop-categories">
       <li>parent_item_1</li>
           <ul class="nm-shop-sub-categories">
              <li>sub_item_1</li>
              <li>sub_item_2</li>
           </ul> 
       <li>parent_item_2</li>
</ul>

由于在我的代码中没有经典的HTML，我不知道如何通过php改变它。有任何想法吗？或者是否没有必要更改结构，我可以使用CSS将此菜单更改为clssic下拉菜单？

更新：我做了Norman提到的更改。但它并没有解决问题。子类别仍与父元素元素分开。

除了第一段代码之外，我还发现了第二个与子类别相关的代码。也许这会有任何帮助吗？

/*
     *  Product category menu: Output sub-categories
     */
    if ( ! function_exists( 'nm_sub_category_menu_output' ) ) {
        function nm_sub_category_menu_output( $current_cat_id, $hide_empty ) {
            global $wp_query, $nm_theme_options;

            // Categories menu divider
            $categories_menu_divider = apply_filters( 'nm_shop_categories_divider', '<span>&frasl;</span>' );

            $output_sub_categories = '';

            // Categories order
            $orderby = 'slug';
            $order = 'asc';
            if ( isset( $nm_theme_options['shop_categories_orderby'] ) ) {
                $orderby = $nm_theme_options['shop_categories_orderby'];
                $order = $nm_theme_options['shop_categories_order'];
            }

            $sub_categories = get_categories( array(
                'type'          => 'post',
                'parent'        => $current_cat_id,
                'orderby'       => $orderby, // Note: 'name' sorts by product category "menu/sort order"
                'order'         => $order,
                'hide_empty'    => $hide_empty,
                'hierarchical'  => 1,
                'taxonomy'      => 'product_cat'
            ) );

            $has_sub_categories = ( empty( $sub_categories ) ) ? false : true;

            // Is there any sub-categories available
            if ( $has_sub_categories ) {
                //$current_cat_name = __( 'All', 'nm-framework' );
                $current_cat_name = apply_filters( 'nm_shop_parent_category_title', $wp_query->queried_object->name );

                foreach( $sub_categories as $sub_category ) {
                    $output_sub_categories .= nm_category_menu_create_list( $sub_category, $current_cat_id, $categories_menu_divider );
                }
            } else {
                $current_cat_name = $wp_query->queried_object->name;
            }

            // "Back" link
            $output_back_link = '';
            if ( $nm_theme_options['shop_categories_back_link'] ) {
                $parent_cat_id = $wp_query->queried_object->parent;

                if ( $parent_cat_id ) {
                    // Back to parent-category link
                    $parent_cat_url = get_term_link( (int) $parent_cat_id, 'product_cat' );
                    $output_back_link = nm_sub_category_menu_back_link( $parent_cat_url, $categories_menu_divider );
                } else if ( $nm_theme_options['shop_categories_back_link'] == '1st' ) {
                    // 1st sub-level - Back to top-level (main shop page) link
                    $shop_page_id = wc_get_page_id( 'shop' );
                    $shop_url = get_permalink( $shop_page_id );
                    $output_back_link = nm_sub_category_menu_back_link( $shop_url, $categories_menu_divider, ' 1st-level' );
                }
            }

            // Current category link
            $current_cat_url = get_term_link( (int) $current_cat_id, 'product_cat' );
            $output_current_cat = '<li class="current-cat"><a href="' . esc_url( $current_cat_url ) . '">' . esc_html( $current_cat_name ) . '</a></li>';

            echo $output_back_link . $output_current_cat . $output_sub_categories;
        }
    }

Answer 1

您需要的结构不是最好用CSS管理

根据代码假设，您似乎需要在结构下面作为结果。

<ul class="nm-shop-categories">
       <li>parent_item_1
           <ul class="nm-shop-sub-categories">
              <li>sub_item_1</li>
              <li>sub_item_2</li>
           </ul> 
       </li>
       <li>parent_item_2</li>
</ul>

为了达到上述结构，我建议你改变这个

这一行

$output_cat = '<li' . $all_categories_class . '><a href="' . esc_url ( $page_url ) . '">' . esc_html__( 'All', 'nm-framework' ) . '</a></li>';

要

$output_cat = '<li' . $all_categories_class . '>';
$output_cat .= '<a href="' . esc_url( $page_url ) . '">' . esc_html__( 'All', 'nm-framework' ) . '</a>';

输出结束

$output = $output_cat . $output_sub_cat;

要

$output = $output_cat . $output_sub_cat .'</li>';

使用php制作带子类别的下拉菜单

1 个答案: