如何将 Woocommerce 中的变体选择添加到产品存档页面?

How to add variation selection in Woo commerce to the Products Archive page?

最近我开始在 Fruits & Vegetable 网站上工作(我使用的是 Woocommerce、Elementor 和 Hello Theme)。

我正在尝试为用户提供 select 存档页面中产品变体的选项,而不仅仅是产品页面。 还向存档页面添加了数量选项。我已经设法使用下面的代码做到了。

这些图片说明了我正在尝试创建的内容: https://imgur.com/a/ahVaqG8

https://imgur.com/a/FnCfFAE

到目前为止,我已经使用以下代码在产品存档页面中添加了数量 selection:

add_filter( 'woocommerce_loop_add_to_cart_link', 'quantity_inputs_for_woocommerce_loop_add_to_cart_link', 10, 2 );
function quantity_inputs_for_woocommerce_loop_add_to_cart_link( $html, $product ) {
    if ( $product && $product->is_type( 'simple' ) && $product->is_purchasable() && $product->is_in_stock() && ! $product->is_sold_individually() ) {
        $html = '<form action="' . esc_url( $product->add_to_cart_url() ) . '" class="cart" method="post" enctype="multipart/form-data">';
        $html .= woocommerce_quantity_input( array(), $product, false );
        $html .= '<button type="submit" class="button alt">' . esc_html( $product->add_to_cart_text() ) . '</button>';
        $html .= '</form>';
    }
    return $html;
}

剩下的部分是创建 2 个变量产品。 第一个产品是每 1 美元一个苹果。 第二个产品是一包苹果,每公斤 5 美元。

和 override/create 显示“产品存档”页面而非“产品页面”selection 的代码

假设对原始代码进行一些调整也可以创建它。

您需要使用 woocommerce_before_shop_loop 操作挂钩在商店页面上添加变体下拉菜单。试试下面的代码。

add_action( 'woocommerce_before_shop_loop', 'show_production_variations_on_shop_page' );
function show_production_variations_on_shop_page() {
    remove_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_loop_add_to_cart', 10 );
    add_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_single_add_to_cart', 30 );
}

已测试并有效