Swapping Including and Excluding Tax Prices On The Product Page

If you have a Bigcommerce store and your product prices show up with both including and excluding tax, you would probably want to choose if the excluding should go first, or the including. By default, the system displays the price with the tax included. This article will show you how to swap the prices to show the price without tax first.

I created a tax inside my test store, and made sure the prices showed up with both including and excluding tax.

By default, a product with a normal price appears like this:

And by default, a product with retail and sale prices appears like this:

As you can see, the price including tax is above the excluding one.

I created the following code, which switches the prices on the product pages:

<script type="text/javascript">
$(document).ready( function() {      
var prodprice = $(".VariationProductPrice").html();     
prodprice = prodprice.split("</span>");
$(".VariationProductPrice").replaceWith(prodprice[1] + "</span><br>" + prodprice[2] + "</span>" + prodprice[0] + "</span>");    
$(".ProductDetailsPriceExTax").css('color','#777');  });
</script>

This code needs to be added under Design->Edit HTML/CSS->product.html-> right before the body tag closes:

After that, one more change is required, inside the ProductDetails.html panel, under the same Design->Edit HTML/CSS page look for the following code:

<span class="ProductPrice retail-product-price">%%GLOBAL_RetailPrice%%</span>
<span class="ProductPrice VariationProductPrice">%%GLOBAL_ProductPrice%%</span> 

And replace it with:

<span class="ProductPrice VariationProductPrice">%%GLOBAL_ProductPrice%% 
<span class="ProductPrice retail-product-price">%%GLOBAL_RetailPrice%%</span>
</span>

Here is how it should appear:

As you can see, I included the retail price inside the existing span for the product price.

Making these two changes on product.html template and ProductDetails.html panel, allows the prices to switch their places, like below.

Here is an example where retail is included:

And another example without retail price:

Thank you for following the steps! I hope this allows you to make the needed changes.