私Woocommerce変数の製品については、単一のページ

Question

WooCommerce変数製品の選択製品バリエーションIDを取得し、私は単一の製品ページ上のカスタムサイズチューを実装し、テーブルにこのサイズを持っている：

これらの変化は、単に以下のとおりです。30B30C30Dではなくにに分割されている：30とBCD

私は何を把握しようとしていますが次のとおりです。どのように各製品のバリエーションのための出荷クラスをつかむ？

私はカートページに似た何かを持っているが、私は変化IDまたはどのように単一の製品ページからそれを得るためにあるのか分からない：

$product_id = (0 != $cart_item['variation_id']) ? $cart_item['variation_id'] : $cart_item['product_id']; 
// need the variation id for the above to be able to do the rest: 

$product_shipping_classes = get_the_terms($product_id, 'product_shipping_class'); 
$product_shipping_class_name = ($product_shipping_classes && ! is_wp_error($product_shipping_classes)) ? current($product_shipping_classes)->name : ''; 

私が持っていたら、私はそれを行う方法を知っていますバリエーションID。私は残りをするためにそれを得る方法を理解できません。私がそれを得るために必要なのは、バリエーションの製品IDとスラッグだけです（このページにも色属性があります）。

しかし、私は製品にデフォルトのバリエーションを使用しました（したがって、隠したvariation_idが設定されています）。

おそらく、選択された色のIDを知って他のIDを取得する必要があるのでしょうか？

Answer 1

可変商品のWooCommerce製品の単一ページでは、ライブイベント（クライアント側、サーバー側ではありません）のため、PHPで選択した製品バリエーションを取得することはできません。

JavaScript/jQueryを使用する方法です。この単一の製品ページに関連するコードを可変製品に関して提供していないので、あなたのニーズに完全に一致する実際の作業コードを私に与えることはできません。

は（この例では、私は動的に以下の選択バリエーションのIDを表示カートに追加]ボタンを）変数製品のための単一の製品ページ上の選択された変動IDを取得します。

add_action('woocommerce_single_product_summary', 'single_product_variable_customization', 3, 0); 
function single_product_variable_customization() { 
    global $product; 

    // Only for variable products on single product pages 
    if ($product->is_type('variable') && is_product()) { 

    ## ==> ==> Here goes your php code (if needed) ==> ==> ## 

    // Passing a variable to javascript 
    $string1 = "The selected Variation ID is: "; 
    $string2 = "No Variation ID is selected "; 
    ?> 
    <script> 
    jQuery(document).ready(function($) { 

     // Initializing 
     var myText1 = '<?php echo $string1; ?>', myText2 = '<?php echo $string2; ?>'; 

     // Get and display the default variation ID after add-to-cart button (initialization) 
     if('' != $('input.variation_id').val()) 
      $('div.woocommerce-variation-add-to-cart').after('<div class="selected-variation-id">'+myText1+$('input.variation_id').val()+'</div>'); 
     else 
      $('div.woocommerce-variation-add-to-cart').after('<div class="selected-variation-id">'+myText2+'</div>'); // No ID selected 

     console.log($('input.variation_id').val()); // Output in the browser console 


     // Get and display the chosen variation ID after add-to-cart button 
     $('select').blur(function(){ 
      if('' != $('input.variation_id').val()) 
       $('div.selected-variation-id').html(myText1+$('input.variation_id').val()); 
      else 
       $('div.selected-variation-id').html(myText2); // No ID selected 

      console.log($('input.variation_id').val()); // Output in the browser console 
     }); 
    }); 
    </script> 
    <?php 
    } 
} 

コードはfunction.phpに行きますあなたのアクティブな子供のテーマ（またはテーマ）のファイル、またはすべてのプラグインファイル。

このコードはWooCommerce 3+の下でテストされ、動作します。

このベースでは、必要な詳細やコードが不要なため、要件に合わせて独自の機能を作成できます。

（jQueryとWoocommerce単一の製品ページで）いくつかの関連解答例の使用方法：バスケットにそう

• Rename Add to Cart buttons for Out Of Stock Products in WooCommerce 3
• Replace Variable Product Price by the chosen variation price in WooCommerce 3
• Variable product selectors: Getting the live selected values
• Pass the chosen product variations data into Contact Form 7 enquiry form