Search code examples
javascriptshopifyliquidshopify-templateliquid-template

How to Shopify Display Exc VAT Price for Product Variants?

Been working on a website where I want two prices to appear on the product page.

  1. Default Inc VAT Price
  2. Exc VAT Price, which would be the default price divided by 1.2

We're using the enterprise theme and I've managed to get it to display on the product page by amending the main-product.liquid file.

          {%- when 'price' -%}
            <div class="product-info__block product-info__block--sm product-price" {{ block.shopify_attributes }}>
              <div class="product-info__price">
                {% render 'price', product: product, use_variant: true %}
                <p> {{ product.price | divided_by: 1.2 | money }} ex. VAT </p>
              </div>

However, the problem I have now is that the price doesn't update when clicking on different variations that the product has, the default price does update, just not the Exc VAT price I've added in.

Any pointers? Thanks.

Solution

  • You can edit price.liquid file.

    Your calculation

    assign tax_price = target.price | divided_by: 1.2
assign tax_money_price = tax_price | money

    price calculation

    Your markup

    <div class="price__regular tax__price">
  <span class="tax-included-price price-item price-item--regular">
    {{ tax_money_price }} excluding VAT.
  </span>
</div>

    markup

    Result

    result

    if any doubts please comment