根据上面添加到购物车按钮的数量显示格式化的 WooCommerce 产品总数

Question

我有一家面料商店，我需要它向顾客清楚地说明他们添加到购物篮中的数量。该产品定为1/2米价格。所以 1 份库存就是半米布料。

https://thefabricboutique.co.uk/product/jennifer-cotton/

我需要在添加到购物车上方注明。

为（价格）添加 (X) 米。

(x) - 数量所表示的一半。 （3个数量=1.5米） （价格）- 随着数量的增加而提高价格。 （3 份，7 英镑 = 21 英镑）

这是一次获得价格的尝试，但我只是在努力完成它！任何帮助都会很棒，谢谢。

我尝试了此代码，它适用于价格，但在数量更改之前似乎货币符号已下降。

add_action( 'woocommerce_before_add_to_cart_quantity', 'qty_front_add_cart' );
 
function qty_front_add_cart() {
    global $woocommerce, $product;
    // let's setup our divs
    echo sprintf('<div id="product_total_price" style="margin-bottom:20px;">%s %s</div>',__('Total price:','woocommerce'),'<span class="price">'.wc_get_price_to_display($product).'</span>');
    ?>
        <script>
            jQuery(function($){
                var price = <?php echo wc_get_price_to_display($product); ?>,
                    currency = '<?php echo get_woocommerce_currency_symbol(); ?>';

                $('[name=quantity]').change(function(){
                    if (!(this.value < 1)) {

                        var product_total = parseFloat(price * this.value);

                        $('#product_total_price .price').html( currency + product_total.toFixed(2));

                    }
                });
            });
        </script>
    <?php 
}

Answer 1

您的代码中存在一些错误和遗漏的内容，请尝试以下操作：

add_action( 'woocommerce_before_add_to_cart_quantity', 'display_product_total_amount_html' );
function display_product_total_amount_html() {
    global $product;

    $meters_per_qty  = 0.5;
    $display_price   = wc_get_price_to_display($product);
    $formatted_price = '<span class="price-amount">'. number_format($display_price, 2) . '</span>';

    // Output product total price amount
    $price_string = sprintf( __('Add %s for %s', 'woocommerce'),  
        '<span class="qty-meters">' . $meters_per_qty . ' meter</span>',
        str_replace('0.00', $formatted_price, wc_price(0)) );

    // Output product total price amount
    echo '<div class="total-price_qty" style="margin-bottom:20px;">'.$price_string.'</div>'
    ?>
    <script>
    jQuery(function($){
        $('input[name=quantity]').on( 'input change', function(){
            const qty = $(this).val();
            if ( qty != 0 ) {
                const lengthTxT = qty > 2 ? ' meters' : ' meter';
                $('.total-price_qty .price-amount').html( parseFloat(<?php echo $display_price; ?> * qty).toFixed(2) );
                $('.total-price_qty .qty-meters').html( parseFloat(<?php echo $meters_per_qty; ?> * qty)+lengthTxT );
            }
        });
    });
    </script>
    <?php 
}

代码位于子主题的functions.php 文件中（或插件中）。已测试并有效。