保持电商网站的产品整洁分类，合理组织产品可以让客户更轻松地找到他们需要的商品。然而，对于有大量产品分类的大型电商网站来说，会麻烦点。
但是，可以通过 创建分类和子分类 来整齐地排列产品，从而提高客户的购物体验，让他们更方便地浏览商店。这一点不能忽略。
在文章中，我们会 一步步指导 如何在 WooCommerce 商店中 显示产品分类和子分类，帮助你们的网站提升用户体验。
无论是 WooCommerce 新手 还是 电商老手，这些技巧都有所帮助。
为什么要在 WooCommerce 中显示产品分类？
在 WooCommerce 商店中显示产品分类有下面几个重要原因：
方便导航：清晰的分类可以让顾客快速找到他们需要的产品，提升购物体验。
更好的产品组织：合理分类能使商店布局更加整洁，提高用户的浏览效率。
提高 SEO 排名：在分类名称中用相关关键词，有助于网站在搜索引擎结果页面（SERP）中获得更好的排名。
有助于营销推广：展示产品分类方便顾客，还能帮助商家更好地推广特定产品或活动，提高转化率。
如何在 WooCommerce 中显示默认分类、子分类和产品
在设置 WooCommerce 商店时，通常会选择 “显示分类/子分类和产品” 选项，方便访客可以直接从首页选择产品，或者通过点击产品分类页面来筛选商品。
在 WooCommerce 商店中显示分类的方法
进入 WooCommerce 设置
前往 WooCommerce → 设置
选择产品选项
点击 产品 选项卡
调整显示设置
选择 显示 选项
在 商店页面显示 和 默认分类显示 选项中，选择 同时显示分类和产品（Show both）
保存更改
点击 保存更改 按钮，应用新的设置
注意事项
如果需要 自定义显示 WooCommerce 分类，可以用代码修改 functions.php 文件（位于主题文件夹中）。要在编辑前 备份网站，防止发生意外。
如何在 WooCommerce 中显示产品分类
WooCommerce 提供了 woocommerce_product_category() 函数，它可以在输出产品之前显示 分类或子分类。这个函数是可插入的（pluggable），意味着可以在主题中 重写 以自定义显示效果。
步骤：
打开 functions.php 文件（位于主题文件夹中）。
插入下面代码，用于在商店页面展示产品分类：function woocommerce_get_product_category_of_subcategories( $category_slug ){
$terms_html = array();
$taxonomy = ‘product_cat’;
$parent = get_term_by( ‘slug’, $category_slug, $taxonomy );
$children_ids = get_term_children( $parent->term_id, $taxonomy );
foreach($children_ids as $children_id){
$term = get_term( $children_id, $taxonomy );
$term_link = get_term_link( $term, $taxonomy );
if ( is_wp_error( $term_link ) ) $term_link = ”;
$terms_html[] = ‘<a href=”‘ . esc_url( $term_link ) . ‘” rel=”tag” class=”‘ . $term->slug . ‘”>’ . $term->name . ‘</a>’;
}
return ‘<span class=”subcategories-‘ . $category_slug . ‘”>’ . implode( ‘, ‘, $terms_html ) . ‘</span>’;
}
代码解析：
get_queried_object_id()：获取当前查询的分类 ID。
get_terms( ‘product_cat’, $args )：获取该分类下的子分类。
woocommerce_subcategory_thumbnail( $term )：显示分类缩略图。
get_term_link( $term )：获取分类链接，并在前端显示。
add_action( ‘woocommerce_before_shop_loop’, ‘woocommerce_product_category’, 100 );：将该函数挂载到 WooCommerce 商店页面的产品列表循环前，确保分类优先显示。
效果：
代码会在 商店页面 显示产品分类，让用户可以先浏览分类，再选择具体产品，提高导航体验。
如何列出 WooCommerce 产品分类的子分类
可以用自定义函数，通过 父级产品分类的 slug 来获取 WooCommerce 的子分类，并以超链接形式展示出来。
操作步骤：
打开 functions.php 文件（位于当前主题的文件夹中）。
插入下面代码，用于获取某个分类下的子分类列表：function woocommerce_get_product_category_of_subcategories( $category_slug ){
$terms_html = array();
$taxonomy = ‘product_cat’;
$parent = get_term_by( ‘slug’, $category_slug, $taxonomy );
$children_ids = get_term_children( $parent->term_id, $taxonomy );
foreach($children_ids as $children_id){
$term = get_term( $children_id, $taxonomy );
$term_link = get_term_link( $term, $taxonomy );
if ( is_wp_error( $term_link ) ) $term_link = ”;
$terms_html[] = ‘<a href=”‘ . esc_url( $term_link ) . ‘” rel=”tag” class=”‘ . $term->slug . ‘”>’ . $term->name . ‘</a>’;
}
return ‘<span class=”subcategories-‘ . $category_slug . ‘”>’ . implode( ‘, ‘, $terms_html ) . ‘</span>’;
}
代码解析：
get_term_by( ‘slug’, $category_slug, $taxonomy )：获取指定分类的对象。
get_term_children( $parent->term_id, $taxonomy )：获取该分类下的所有子分类 ID。
遍历 $children_ids：获取子分类的 term 对象。
获取分类链接 get_term_link( $term, $taxonomy )。
生成 <a> 超链接，展示子分类名称。
返回 HTML 代码，将所有子分类用逗号分隔显示出来。
效果：
这段代码可以用于在 WooCommerce 商店页面 动态显示某个产品分类的子分类，方便用户浏览和筛选产品。
如何显示 WooCommerce 分类描述
可以在 WooCommerce 产品详情页的模板文件 中添加代码，以显示产品所属分类的描述信息。
代码说明：
通过 wp_get_post_terms() 获取当前产品的 分类信息。
遍历分类数组，获取并输出分类的 描述内容。
代码示例：
global $post;
$args = array( ‘taxonomy’ => ‘product_cat’,);
$terms = wp_get_post_terms($post->ID,’product_cat’, $args);
$count = count($terms);
if ($count > 0) {
foreach ($terms as $term) {
echo ‘<div class=”woocommerce-get-product-category”>’;
echo $term->description;
echo ‘</div>’;
}
}
效果：
这段代码将在 产品详情页 显示该产品所属分类的 描述信息，方便用户了解该分类的详细内容。
如何创建自定义插件来显示 WooCommerce 产品分类
在 WooCommerce 中，通常可以通过在 functions.php 文件中添加代码来显示产品分类和子分类。如果不想修改 functions.php。
解决方案：创建自定义插件
将功能封装到插件中，可以 避免修改主题文件，还可以 随时启用或禁用该功能，更加灵活。
步骤 1：创建插件文件夹
进入 wp-content/plugins 目录，在其中创建一个新文件夹，例如：
361sale-products-categories-in-archives
步骤 2：创建插件文件
在刚创建的文件夹中，新建一个 PHP 文件，命名为：361sale-product.php
打开该文件，并添加插件基本信息：<?php
/**
* Plugin Name: WooCommerce Product Category
* Description: Display WooCommerce categories on WooCommerce product pages
**/
步骤 3：添加分类显示功能
在插件文件中添加下面代码，用于获取并显示产品分类和子分类：
function 361sale_product_subcategories( $args = array() ) {
}
add_action( ‘woocommerce_before_shop_loop’, ‘361sale_product_subcategories’, 50 );
现在在函数中添加下面代码片段：
$parentid = get_queried_object_id();
$args = array(
‘parent’ => $parentid
);
$terms = get_terms( ‘product_cat’, $args );
if ( $terms ) {
echo ‘<ul class=”product-cats”>’;
foreach ( $terms as $term ) {
echo ‘<li class=”category”>’;
woocommerce_subcategory_thumbnail( $term );
echo ‘<h2>’;
echo ‘<a href=”‘ . esc_url( get_term_link( $term ) ) . ‘” class=”‘ . $term->slug . ‘”>’;
echo $term->name;
echo ‘</a>’;
echo ‘</h2>’;
echo ‘</li>’;
}
echo ‘</ul>’;
}
上面代码首先获取当前查询的对象，并将其 ID 定义为 $parentid。
然后，它用 get_terms() 函数查找当前分类下的 子分类。
对于每个子分类，该代码会：
用 woocommerce_subcategory_thumbnail() 显示分类缩略图
在分类名称外添加超链接，指向该分类的 归档页面
创建插件样式文件
在插件文件夹中创建 css 目录
在 css 目录下创建 style.css 文件
插件主文件命名为 cloudways-product.php
在插件文件中添加下面代码来加载 CSS 文件：function 361sale_product_cats_css() {
wp_register_style( ‘361sale_product_cats_css’, plugins_url( ‘css/style.css’, __FILE__ ) );
wp_enqueue_style( ‘361sale_product_cats_css’ );
}
add_action( ‘wp_enqueue_scripts’, ‘361sale_product_cats_css’ );
这样，插件就能正确加载 style.css，用于自定义子分类的显示样式。
如何在 WooCommerce 商店页面显示产品分类
在 WooCommerce 商店页面显示产品分类非常简单，按照下面步骤操作即可：
进入 WordPress 后台，悬停在 外观（Appearance） 按钮上。
点击“自定义（Customize）” 选项。向下滚动，找到 WooCommerce > 产品目录（Product Catalog）。找到“商店页面显示”（Shop Page Display）设置，点击下拉菜单，选择 “显示分类”（Show Categories）。
保存更改，商店页面现在会显示产品分类。
这样，就能轻松在 WooCommerce 商店页面展示 产品分类，优化用户浏览体验。
此外，还可以通过 侧边栏 和 菜单 来显示产品分类，后面可以进一步了解这些方法。
如何在侧边栏显示产品分类
在 侧边栏 显示产品分类是一个很好的优化策略，它可以让顾客在浏览商店时 始终看到可选的分类，方便他们进一步探索产品。
设置方法
进入 WordPress 后台，前往 外观 > 小工具（Widgets）。
找到侧边栏（Sidebar）并点击下拉菜单。查找“产品分类（Product Categories）”小工具。
拖动该小工具到侧边栏区域，然后进行自定义设置。
可以添加其他小工具，例如价格筛选、分类筛选等，增强侧边栏的功能性。
这样，在 WooCommerce 侧边栏显示产品分类后，顾客可以 更方便地浏览不同分类的商品，提升购物体验。
如何在菜单中显示 WooCommerce 产品分类
在菜单中显示 产品分类 是一种直观的方式，能够让顾客快速了解商店销售的商品类别。
设置方法
进入 WordPress 后台，前往 外观 > 菜单（Menus）。点击左上角的“屏幕选项”（Screen Options），然后勾选 “产品分类”（Product Categories）。在左侧面板中，会出现“产品分类”选项，点击展开，即可看到商店中的所有分类。
选择要添加到菜单的分类，然后点击 “添加到菜单”（Add to Menu） 按钮。点击“保存菜单”（Save Menu） 按钮，完成设置。
这样，WooCommerce 商店的产品分类就会出现在网站导航菜单中，方便顾客快速浏览和选择商品。
其他 WooCommerce 商店可能需要的产品分类操作
在某些情况下，需要 隐藏 或 排序 产品分类，例如：
避免分类之间的重叠
图片已经清楚展示了分类，无需额外标签
根据特定需求调整分类显示方式
下面是一些 WooCommerce 产品分类相关的操作，可以帮助你们更灵活地管理商店分类。
如何在 WooCommerce 中隐藏产品分类
在 WooCommerce 中，可以通过下面两种方法隐藏产品分类：
使用插件
使用代码
方法 1：用插件隐藏产品分类
可以用 Hide Categories and Products for WooCommerce 插件来隐藏分类。该插件是付费工具，价格为 $4.09/月。
安装并激活插件后，你会在 WooCommerce 选项下找到 产品可见性（Product Visibility） 设置。
操作步骤
进入 WooCommerce → Products Visibility → Global Visibility。
选择你想要隐藏的产品分类。
保存更改，隐藏的分类将在商店页面中消失。
这种方法适用于不想改代码的用户，操作简单且方便管理。
如何用代码隐藏 WooCommerce 产品分类
也可以用自定义代码的方式来隐藏产品分类。下面是一个示例代码，它用了 get_term 过滤器来控制产品分类的显示：
add_action( ‘woocommerce_before_shop_loop’, ‘show_product_categories’, 20 );
function show_product_categories() {
// Display product categories
echo do_shortcode( ‘[product_categories]’ );
}
如何在 WooCommerce 中隐藏产品分类标题、产品数量及按分类排序
隐藏 WooCommerce 产品分类标题
可以用下面代码来 隐藏产品分类标题：
add_action( ‘init’, function() {
remove_action( ‘woocommerce_shop_loop_subcategory_title’, ‘woocommerce_template_loop_category_title’, has_action( ‘woocommerce_shop_loop_subcategory_title’, ‘woocommerce_template_loop_category_title’ ) );
} );
隐藏 WooCommerce 产品分类中的产品数量
如果你不希望在分类页面显示 产品数量，可以使用以下 短代码 来隐藏：
add_filter( ‘woocommerce_subcategory_count_html’, function( $markup, $category ) {
return null;
}, 10, 2 );
按分类排序 WooCommerce 产品
可以用下面代码片段 按分类对 WooCommerce 产品进行排序：
add_filter( ‘woocommerce_subcategory_count_html’, function( $markup, $category ) {
return null;
}, 10, 2 );
如何设置 WooCommerce 分类图片大小
可以按照下面步骤 调整 WooCommerce 分类图片大小：
进入 WordPress 后台，前往 外观 > 自定义（Customize）。在自定义面板中，点击 WooCommerce > 产品图片（Product Images）。
在图片设置中，选择 默认尺寸 或 点击“自定义” 手动设置图片大小。
这样，就可以轻松调整 WooCommerce 分类图片的尺寸，让其更符合商店布局。
WooCommerce 显示产品分类常见问题及解决方案
在 WooCommerce 商店中显示产品分类时，用户可能会遇到一些常见问题。下面是这些问题的解决方案。
问题 1：菜单中不显示产品分类
有时，已创建的产品分类不会出现在 网站菜单 中。
解决方案
进入 外观 > 菜单（Menus）。
点击右上角的 “屏幕选项”（Screen Options）。
勾选 “产品分类”（Product Categories）选项。在左侧栏中，现在可以看到产品分类。选择要添加到菜单的分类，然后点击 “添加到菜单”（Add to Menu）。
问题 2：分类图片未显示
有时，WooCommerce 分类页面可能不会显示分类图片。
解决方案
确保每个分类都已 设置图片。
进入 产品 > 分类（Products > Categories）。
点击分类名称下方的 “编辑”（Edit）。
向下滚动到 “缩略图”（Thumbnail）部分，点击 “上传/添加图片”（Upload/Add Image）。保存更改，然后刷新页面检查是否生效。
问题 3：分类显示顺序错误
有时候，WooCommerce 分类可能会以错误的顺序显示。
解决方案
进入 产品 > 分类（Products > Categories）。
用 拖拽（Drag-and-Drop） 方式 重新排列分类顺序。
问题 4：显示空的产品分类
默认情况下，WooCommerce 会显示所有分类，包括没有产品的分类。
解决方案
如果想隐藏空分类，在 主题的 functions.php 文件 中添加下面代码片段：
add_filter( ‘woocommerce_product_subcategories_args’, ‘hide_empty_categories’ );
function hide_empty_categories( $args ) {
$args[‘hide_empty’] = 1;
return $args;
}
问题 5：分类页面未被搜索引擎索引
有时，WooCommerce 分类页面 不会被搜索引擎索引，影响 SEO 排名。
解决方案
检查 SEO 插件设置（如 Yoast SEO 或 Rank Math），确保分类页面未被设置为 “noindex”。
进入 设置 > 阅读（Settings > Reading），确保 “阻止搜索引擎索引本站点”（Discourage search engines from indexing this site）未被勾选。
总结
在 WooCommerce 商店中显示产品分类和子分类对于提供 清晰有序的购物体验 至关重要。通过对产品进行分类，可以让客户更轻松地找到所需商品。