Articles on: Building Calculators

Implementing Quantity Field (Price per item and Total price)

We made this help article because Shopify doesn't show the total price on the product page as it only shows once the item is in the cart. Here, we will help you implement the price per item on the product page to avoid confusion.

To implement a quantity field in a calculator, just use a number input element from the list of elements
In the properties of the number input element, just enable the toggle called "Use as Quantity"

Scroll down to see the calculator configuration.
In the Formula Configuration, don't include the quantity.

In the Formula Label, please put the price per item.

Lastly, if you want to show the total price on the product page, you can have the calculation display element.
Multiply the quantity in the Formula. Just like the image below.

Here is the output once the calculator is applied to the product page.

Here is what you can see in the shopping cart.

Updated on: 04/08/2022

Was this article helpful?

Share your feedback


Thank you!