当所选变体在WooCommerce中缺货时显示表单

Question

在WooCommerce with Contact Form 7插件中，我在单品页面上添加了一个表单，使用以下代码：

add_action( 'woocommerce_single_product_summary', 'add_contact_form', 30, 2 );
function add_contact_form() {
    global $product;

    if( ! $product->is_in_stock( ) && ! $product->is_type('variable') ) {
       echo do_shortcode('[contact-form-7 id="14880" title="Fiyat Sorunuz"]');
    }
}

这种“缺货”表单只适用于简单的产品：

但对可变产品的“缺货”产品变体不起作用：

Answer 1

这需要对您的代码和一些jQuery代码进行一点更改，以显示/隐藏可变产品上的联系人表单（和add to cart按钮），这取决于所选的产品变体库存状态。

简单易变产品的更换代码：

add_action( 'woocommerce_single_product_summary', 'add_product_outofstock_contact_form', 30, 2 );
function add_product_outofstock_contact_form() {
    global $product;

    $contact_form = do_shortcode('[contact-form-7 id="14880" title="Fiyat Sorunuz"]');

    if( $product->is_type('variable') ) {
        echo '<div class="outofstock-form" style="display:none">' . $contact_form . '</div>';
    } elseif( ! $product->is_in_stock() ) {
        echo $contact_form;
    }
}

add_action('woocommerce_after_variations_form', 'outofstock_product_variation_js');
function outofstock_product_variation_js() {
    ?>
    <script type="text/javascript">
    jQuery(function($) {
        var contactFormObject  = $('.outofstock-form'),
            addToCartButtonObj = $('.woocommerce-variation-add-to-cart');

        $('form.variations_form').on('show_variation', function(event, data) { // No selected variation
            if ( ! data.is_in_stock  ) {
                addToCartButtonObj.hide('fast');
                contactFormObject.show('fast');
            } else {
                addToCartButtonObj.show('fast');
                contactFormObject.hide('fast');
            }
        }).on('hide_variation', function() { // Not on selected variation
            addToCartButtonObj.show('fast');
            contactFormObject.hide('fast');
        });
    });
    </script>
    <?php
}

代码放在活动子主题（或活动主题）的functions.php文件中。经过测试并起作用。