Comment remplacer la fourchette de prix par le prix de variation choisi dans WooCommerce 3 ?

Remplacez la fourchette de prix variable par le prix de variation choisi dans WooCommerce 3

Problème :

Sur WooCommerce 3, la mise en page variable du produit inclut une fourchette de prix disgracieuse en dessous du produit titre. Cela peut être déroutant et peu informatif, surtout lorsqu'il reste inchangé après la sélection d'une variation.

Solution :

Pour remplacer la fourchette de prix par le prix de variation choisi et l'assurer met à jour en conséquence :

1. Supprimer les éléments indésirables Prix :

   remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_price', 10 );

2. Insérer le prix variable sans fourchette et afficher le prix le plus bas :

   add_action( 'woocommerce_single_product_summary', 'replace_variation_single_price', 10 );

3. Copiez le prix variable dans un fichier caché Conteneur :

   echo '<div class="hidden-variable-price">' . $price . '</div>';

4. Masquer le prix et la disponibilité de la variante choisie :

   div.woocommerce-variation-price,
   div.woocommerce-variation-availability {
       height: 0px !important;
       overflow: hidden;
       line-height: 0px !important;
       font-size: 0% !important;
   }

5. Utilisez jQuery pour mettre à jour le Prix :

   $('select').blur(function() {
       if ($('input.variation_id').val()) {
           $('p.availability').remove();
           $('p.price').html($('div.woocommerce-variation-price > span.price').html()).append('<p class="availability">' + $('div.woocommerce-variation-availability').html() + '</p>');
       } else {
           $('p.price').html($('div.hidden-variable-price').html());
           if ($('p.availability')) {
               $('p.availability').remove();
           }
       }
   });

Notes supplémentaires :

• Cette solution est testée et compatible avec WooCommerce 3.2.x et versions antérieures.
• Vous pouvez éventuellement déplacer le code CSS dans le styles.css de votre thème fichier.
• Certains plugins ou thèmes peuvent ne pas être compatibles avec ce code.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!