Obtenir l'ID de variation du produit sélectionné dans les produits variables WooCommerce pages simples

Question

Pour mes produits variables WooCommerce Je mettant en oeuvre une taille personnalisée chooser sur la page produit unique et ont cette taille dans un tableau:

ces variations sont juste: 30B30C30D plutôt que d'être divisé pour: 30 et BCD

ce que je suis en train de comprendre est: Comment saisir la classe d'expédition pour chaque variation de produit?

J'ai quelque chose de similaire à la page de panier, mais je ne sais pas quel est l'ID de variation ou comment obtenir de la page produit unique:

$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 : ''; 

Je sais comment le faire une fois que je la ID de variation. Je ne peux pas comprendre comment l'obtenir pour faire le reste. Les seules choses que je dois obtenir pour cela sont l'identifiant du produit et le slug pour les variations (il y a aussi un attribut de couleur sur cette page).

Cependant, j'ai donné au produit une variante par défaut à utiliser (donc le variation_id caché est défini).

Peut-être que cela doit être récupéré d'abord pour connaître l'identifiant de la couleur sélectionnée pour ensuite récupérer les ID de variation pour les autres?

Answer 1

Dans les pages individuelles du produit WooCommerce pour les produits variables, vous ne pouvez pas obtenir la variation de produit sélectionnée en PHP car il s'agit d'un événement en direct (côté client, et non côté serveur).

La méthode consiste à utiliser JavaScript/jQuery pour l'obtenir. Comme vous ne fournissez pas de code associé pour cette page produit unique concernant vos produits variables, il m'est impossible de vous donner un véritable code de travail qui correspondra parfaitement à vos besoins.

obtenir l'ID de variation sélectionnée à la page produit unique pour le produit variable de (Dans cet exemple, afficher l'ID de variation sélectionnée de manière dynamique ci-dessous bouton ajouter au panier):

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 
    } 
} 

Code va dans function.php fichier de votre thème enfant actif (ou thème) ou également dans n'importe quel fichier plugin.

Ce code a été testé sous WooCommerce 3+ et fonctionne.

Sur cette base, vous pouvez créer votre propre fonction pour répondre à vos besoins (vous ne donnez plus les détails ou le code nécessaires).

Quelques réponses connexes exemples d 'utilisation (avec un seul pages produit jQuery et 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