WooCommerce购物车商品按分类分组展示实现方案咨询

Hey there! Let's walk through how to group your WooCommerce cart items by product category to achieve that organized display you described: 分类1 商品1 - $10，商品2 - $20；分类2 商品1 - $10，商品2 - $20

核心思路 #

我们会通过WooCommerce的钩子替换默认的购物车内容输出逻辑，先把购物车商品按分类分组，再按「分类名 + 下属商品」的格式渲染出来。这种方式不需要修改核心模板（更易维护），直接在主题的functions.php或者自定义功能插件里添加代码即可。

步骤1：添加分组逻辑代码 #

把以下代码添加到你的主题functions.php文件（或者自定义插件的主文件中）：

// 移除默认的购物车内容输出
remove_action('woocommerce_cart_contents', 'woocommerce_cart_contents', 10);

// 添加自定义的分类分组购物车内容输出
add_action('woocommerce_cart_contents', 'custom_grouped_cart_contents', 10);

function custom_grouped_cart_contents() {
    global $woocommerce;
    $cart_items = $woocommerce->cart->get_cart();
    
    // 初始化分组数组，键为分类标识，值为分类名+对应商品
    $grouped_items = array();

    // 遍历所有购物车商品，按分类分组
    foreach ($cart_items as $cart_item_key => $cart_item) {
        $_product = apply_filters('woocommerce_cart_item_product', $cart_item['data'], $cart_item, $cart_item_key);
        
        // 获取商品的第一个分类（若商品属多分类，这里取第一个；可按需调整）
        $product_categories = get_the_terms($_product->get_id(), 'product_cat');
        if ($product_categories && !is_wp_error($product_categories)) {
            $first_category = reset($product_categories);
            $category_key = $first_category->term_id . '_' . $first_category->name;
            
            // 将商品添加到对应分类组
            if (!isset($grouped_items[$category_key])) {
                $grouped_items[$category_key] = array(
                    'name' => $first_category->name,
                    'items' => array()
                );
            }
            $grouped_items[$category_key]['items'][$cart_item_key] = $cart_item;
        } else {
            // 处理无分类商品，归到「未分类」组
            if (!isset($grouped_items['uncategorized'])) {
                $grouped_items['uncategorized'] = array(
                    'name' => __('未分类', 'woocommerce'),
                    'items' => array()
                );
            }
            $grouped_items['uncategorized']['items'][$cart_item_key] = $cart_item;
        }
    }

    // 渲染分组后的购物车内容
    foreach ($grouped_items as $group) {
        echo '<div class="cart-category-group">';
        // 输出分类名称
        echo '<strong>' . esc_html($group['name']) . '</strong> ';
        
        $item_outputs = array();
        // 遍历当前分类下的商品，生成每个商品的显示文本
        foreach ($group['items'] as $cart_item_key => $cart_item) {
            $_product = apply_filters('woocommerce_cart_item_product', $cart_item['data'], $cart_item, $cart_item_key);
            $product_name = apply_filters('woocommerce_cart_item_name', $_product->get_name(), $cart_item, $cart_item_key);
            $product_price = apply_filters('woocommerce_cart_item_price', WC()->cart->get_product_price($_product), $cart_item, $cart_item_key);
            
            // 组装商品显示文本：商品名 - 价格
            $item_outputs[] = esc_html($product_name) . ' - ' . $product_price;
        }
        
        // 用逗号分隔商品，分类之间用分号分隔
        echo implode('，', $item_outputs);
        echo '；';
        echo '</div>';
    }
}

步骤2：添加基础样式（可选） #

如果需要让分组展示更美观，可以添加一点CSS到主题的自定义CSS区域：

.cart-category-group {
    margin-bottom: 10px;
    padding: 8px 0;
    border-bottom: 1px solid #eee;
}
.cart-category-group strong {
    color: #2d3748;
    font-size: 1.1em;
}

关键说明 #

• 多分类商品处理：代码默认取商品的第一个分类进行分组，若需要按「主分类」或其他规则分组，可调整$first_category的获取逻辑。
• 无分类商品：自动归到「未分类」组，你可以根据需求修改这个组的名称。
• 兼容性：代码基于WooCommerce最新稳定版编写，若使用旧版本，可能需要微调get_cart()等方法的调用。

内容的提问来源于stack exchange，提问作者Dimitry