如何针对特定WooCommerce商品分类隐藏quantity类Div

算力阿峰

2026-7-1

解决特定商品分类下隐藏Quantity元素的问题

方法一：CSS精准定位（最简单方案）

WooCommerce会自动给商品分类页面的<body>标签添加专属类名，格式通常是 term-{分类别名} 或 product-category-{分类别名}。操作步骤如下：

打开目标商品分类页面，右键「检查元素」，找到<body>标签里的分类专属类（比如分类别名为digital-goods，对应的类名就是term-digital-goods）。
进入WordPress后台「外观→自定义→额外CSS」，添加以下代码：

/* 隐藏目标分类列表页中所有商品的quantity元素 */
.term-digital-goods .quantity {
    display: none;
}

/* 若需同时隐藏该分类下单个商品详情页的quantity元素 */
.single-product.post-type-product.term-digital-goods .quantity {
    display: none;
}

把代码中的digital-goods替换成你实际的分类别名即可。

方法二：PHP钩子实现更灵活控制

如果需要在更多场景（比如购物车中该分类商品的数量输入框）隐藏，或不想用强制样式覆盖，可以用WooCommerce钩子实现：
打开主题的functions.php文件（推荐用子主题文件，避免主题更新丢失代码），添加以下代码：

add_action('wp_head', 'hide_quantity_for_target_category');
function hide_quantity_for_target_category() {
    // 替换为你的目标分类ID或别名，多个分类用数组，比如 array(15, 'virtual-products')
    $target_cats = array('digital-goods');
    
    // 判断当前页面是否为目标分类的列表页，或属于该分类的单个商品页
    if ( (is_product_category($target_cats)) || (is_product() && has_term($target_cats, 'product_cat')) ) {
        echo '<style>.quantity { display: none; }</style>';
    }
}

该方法会自动识别页面归属，精准输出隐藏样式，无需强制覆盖。