Calculate Total Price Upon Qty Increment on Single Product Page

Ecommerce customers may enjoy some modification on the WooCommerce single product page. As soon as they increase the add to cart quantity, it’d be nice if product price could be recalculated or maybe if a “TOTAL” line could appear so that users always know how much they are about to add to cart.

/**
 * @snippet       Calculate Subtotal Based on Quantity - WooCommerce Single Product
 * @author        Codeithub
 */
 
add_action( 'woocommerce_after_add_to_cart_button', 'Codeithub_product_price_recalculate' );
 
function codeithub_product_price_recalculate() {
   global $product;
   echo '<div id="subtot" style="display:inline-block;">Total: <span></span></div>';
   $price = $product->get_price();
   $currency = get_woocommerce_currency_symbol();
   wc_enqueue_js( "      
      $('[name=quantity]').on('input change', function() { 
         var qty = $(this).val();
         var price = '" . esc_js( $price ) . "';
         var price_string = (price*qty).toFixed(2);
         $('#subtot > span').html('" . esc_js( $currency ) . "'+price_string);
      }).change();
   " );
}

Before:

See also  Move Top Bar Outside The Header Worpress
single product page of woocommerce

After:

Total amount calculation after increment

4 Comments

  1. hello,

    could help me to modify this code?

    I would like to change something:
    – move whole function below add to cart button
    – show gross price (+23% VAT instead net price)
    – display currency after price : now its “zł100” -> I want to get 100 zł + custom text here “like without transport cost”

    Will be grateful for help.

    Thank you.
    Adrian

  2. I am using this code on my website and it works great. Thank you for that. But I am facing some issues. The “”get_price()” doesn’t pick the right price of a variation for a specific user role. “get
    -price_html()” works great and picks the right price but I cannot perform calculations on it. What should I do?

Leave a Reply

Your email address will not be published. Required fields are marked *