WooCommerce商店与归档页展示产品变体，需保留选择项及色板

一、插件调整方案（针对已有插件优化） #

如果你坚持使用「Variation as Single Product」插件，可通过以下设置修正：

• 进入插件设置面板，找到Display Settings或类似选项组
• 取消勾选「Replace variation selectors with Add to Cart button」（或同类描述的选项）
• 保存设置后刷新商店页，每个独立展示的变体将保留原产品的色板和变体选择控件

如果该插件无此选项，可替换为「WooCommerce Show Single Variations」插件：

• 安装启用后，在插件设置中开启「Show variations as separate products in archives」
• 找到「Variation Controls」选项，勾选「Keep variation selectors on single variation items」
• 若使用第三方色板插件（如Color/Image Variation Swatches），需在对应插件设置中开启「Display swatches on archive pages」

二、自定义代码方案（无需插件） #

1. 让变体在归档页独立显示 #

将以下代码添加到主题的functions.php文件（建议使用子主题，避免主题更新丢失代码）：

// 允许产品变体在商店/归档页显示
add_filter( 'woocommerce_product_query_posts_where', 'show_variations_in_archives' );
function show_variations_in_archives( $where ) {
    if ( is_shop() || is_product_category() || is_product_tag() ) {
        $where .= " OR wp_posts.post_type = 'product_variation'";
    }
    return $where;
}

// 标记变体为可见状态
add_filter( 'woocommerce_product_is_visible', 'make_variations_visible', 10, 2 );
function make_variations_visible( $visible, $product_id ) {
    $product = wc_get_product( $product_id );
    if ( $product && $product->is_type( 'variation' ) ) {
        $visible = true;
    }
    return $visible;
}

2. 在变体条目保留选择控件和色板 #

复制主题中woocommerce/content-product.php文件到子主题对应目录，找到原有加入购物车的代码块（通常是do_action( 'woocommerce_' . $product->get_type() . '_add_to_cart' );），替换为以下代码：

global $product;
if ( $product->is_type( 'variation' ) ) {
    $parent_product = wc_get_product( $product->get_parent_id() );
    if ( $parent_product && $parent_product->is_type( 'variable' ) ) {
        // 加载父产品的变体选择器和色板
        wc_get_template( 'single-product/add-to-cart/variable.php', array( 'product' => $parent_product ) );
    }
} else {
    do_action( 'woocommerce_' . $product->get_type() . '_add_to_cart' );
}

3. 适配色板插件 #

如果使用第三方色板插件，需确保插件支持归档页显示。一般在插件设置中找到「Archive Page」相关选项，开启「Display swatches」即可。

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