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

Question

在带有 Contact Form 7 plugin 的 WooCommerce 中，我使用以下代码在单个产品页面上为缺货的简单产品添加了一个表单：

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 代码进行一些更改，以 show/hide 可变产品的联系表（和添加到购物车按钮），具体取决于所选产品变体库存状态.

简单可变产品替换代码：

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 文件。已测试并有效。

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

Display a form when the selected variation is out of stock in WooCommerce

php

jquery

contact-form-7

woocommerce

product-variations