在 WooCommerce 单个产品上动态设置和显示自定义产品变体值

如何解决在 WooCommerce 单个产品上动态设置和显示自定义产品变体值

我有一个 WooCommerce 珠宝网站。在单变量产品页面上，我有变体，并添加了一个文本框（文本框供客户写下将印在珠宝上的东西）。

所以我希望页面按如下方式工作：如果客户选择特定的产品变体并开始在文本框中输入产品的价格应根据字母数量而变化（注意：这应该仅在一个特定变体是选择）对所有其他产品的价格将是固定的。

我确实设法完成了文本框价格更新的部分。

我在这里遇到的问题是选择特定的产品变体。

基于 Display the product attribute term for the selected variation in Woocommerce 的回答，我尝试通过以下代码尝试解决此问题：

function vendor_defined_taxonomy() {
    return 'Materijal'; 
}

add_action( 'woocommerce_product_meta_end','display_product_vendors',10 );
function display_product_vendors() {
    $taxonomy = vendor_defined_taxonomy();
    $term_ids = wp_get_post_terms( get_the_ID(),$taxonomy,array('fields' => 
    'ids') );
    if( sizeof($term_ids) > 0 ){ 
        echo '<span class="posted_in vendors"></span>';
    }
}

add_filter( 'woocommerce_available_variation','selected_variation_vendor_value',10,3 );
function selected_variation_vendor_value( $data,$product,$variation ) {
    $taxonomy = vendor_defined_taxonomy();

    if( isset($data['attributes']['attribute_'.$taxonomy]) )
        $term = get_term_by( 'slug',$data['attributes']['attribute_'.$taxonomy],$taxonomy );

    if( isset($term) && is_a($term,'WP_Term' ) )
        $data['variation_description'] .= '<input type="hidden" name="vendor- hidden" id="vendor-hidden" value="'.$term->name.'">';

    return $data;
}

add_action('woocommerce_before_add_to_cart_button','custom_product_jquery_script');
function custom_product_jquery_script() {
    global $product;

    $taxonomy     = vendor_defined_taxonomy();
    $terms_string = $product->get_attribute($taxonomy);

    if( ! empty($terms_string) ) :
    ?>
    <script type="text/javascript">
    jQuery(function($) {
        var form = 'form.variations_form',selected = 'input[name="variation_id"]',vendorVal = 'input#vendor-hidden',vendorTarget = 'span.vendors',vendorHtml = $(vendorTarget).text(),vendorLabel = '';

        // On variation select
        $(form).on( 'blur','select',function() {
            if($(selected).val() != ''){
                $(vendorTarget).text("");
                if($(vendorVal).val() == 'Zlato'){
                    //$(vendorTarget).text(vendorLabel+' 
                    '+$(vendorVal).val());
                    $(vendorTarget).text("here is your text");
                }
            } 
        });
    });
    </script>
    <?php
    endif;
}

但是我无法在产品元部分下打印“Matrijal”产品属性选择的名称值。

产品属性名称是“Matrijal”（和slug“mats”）……例如一个术语名称是“Zlato”（和slug“zlato”）。

有什么帮助吗？

解决方法

你让事情变得更复杂了……

这是一种轻量级且有效的方法，可将特定的选定变体自定义值（来自特定产品属性）添加到单个产品元数据之后的附加 html ''。

您只需要在第一个函数中定义正确的产品属性分类即可。

代码：

// Add custom variation data to variation form data
add_filter( 'woocommerce_available_variation','add_variation_vendor_value',10,3 );
function add_variation_vendor_value( $data,$product,$variation ) {
    // Here define the targeted taxonomy used in product variation
    $taxonomy  = 'pa_mats';

    $term_name = $variation->get_attribute($taxonomy);

    if( ! empty($term_name) ) {
        $data['vendor_value'] = $term_name;
    }
    return $data;
}

// Display after product meta an empty span html on variable products 
add_action( 'woocommerce_product_meta_end','display_product_vendors',10 );
function display_product_vendors() {
    global $product;

    if ( $product->get_type() === 'variable' ) {
        echo '<span class="posted_in vendors"></span>';
    }
}

// Fill in our html "span" with specific text value from selected variation
add_action('woocommerce_after_variations_form','custom_product_variation_js');
function custom_product_variation_js() {
    ?>
    <script type="text/javascript">
    jQuery(function($) {
        var $form   = $('form.variations_form'),$vendor = $('span.vendors'),text    = $vendor.text();

        $form.on('show_variation',function(event,data){ // On selected variation
            if ( data.vendor_value ) {
                $vendor.text( data.vendor_value );
            }
        }).on('hide_variation',function(){ // Not on selected variation
            $vendor.text( text );
        });
    });
    </script>
    <?php
}

代码位于活动子主题（或活动主题）的functions.php 文件中。

在具有定义的产品属性（变体）分类法的可变产品上测试并适用于最新的 WooCommerce 版本 (4.9.2)。

请记住，产品属性分类法始终以“pa_”+ 产品属性标签开头。