WooCommerce移動變體描述

Question

我試圖將變體描述的位置移動到WooCommerce網站上的添加到購物車按鈕下方。我注意到，（不像變化產品的所有其他部分），它使用的是JS模板：

<script type="text/template" id="tmpl-variation-template"> 
    <div class="woocommerce-variation-description"> 
     {{{ data.variation.variation_description }}} 
    </div> 

    <div class="woocommerce-variation-price"> 
     {{{ data.variation.price_html }}} 
    </div> 

    <div class="woocommerce-variation-availability"> 
     {{{ data.variation.availability_html }}} 
    </div> 
</script> 
<script type="text/template" id="tmpl-unavailable-variation-template"> 
    <p><?php _e('Sorry, this product is unavailable. Please choose a different combination.', 'woocommerce'); ?></p> 
</script> 

然而，當我試圖走動的代碼模板中，它只是停留在完全相同的地方即使我已將它放在添加到購物車按鈕後。

而且我也嘗試了here和here的鉤子代碼，但這些也都失敗了（我懷疑WooCommerce 3和更高版本中的某些東西已經改變了，我正在使用它）。任何人都知道如何移動變體描述？

Answer 1

可能不是最好的解決辦法，但周圍去實現它，你可以在你的function.php使用一點的jQuery：

/*Move the description div to another one 
    ===================================== */ 
    add_action('wp_footer', 'move_composite_product_tab'); 
    function move_composite_product_tab() { 
     if (is_product()) : 
     ?> 
     <script> 
      jQuery(document).ready(function($) { 
       $(window).load(function() { 
        $(".product-short").wrap("<div id='variation-excerpt'></div>"); 
        $(".variations_form").after("<div class='product-after-main'></div>"); 
        document.getElementsByClassName("product-after-main")[0].appendChild(
        document.getElementById("variation-excerpt") 
        ); 
       }); 
      }); 
     </script> 
    <?php 
    endif; 
    } 

替換「產品短」通過你的描述的容器。

1. 包裝產品說明。
2. 在所需的div後面創建一個新的類
3. 將新包裝的div（＃variation-excerpt）移動到新創建的一個（.product-after-main）下。

希望有所幫助！歡呼聲