If a merchant sells products in specific quantities or measurements, they might need to display a price per unit for those products. For example, if a product is sold in weights of 500g, 1kg, and 1.5kg, a merchant might want to show the price per 100g for each variant.
In this tutorial, you'll learn how to display unit prices for product variants.
To display unit prices in your theme, you'll use the following:
Depending on where you're implementing your unit price display, you'll access unit price information through the associated parent object:
|Context||Example template types||Parent object|
|Variants that have been added to a cart or are part of an order||line_item|
|Product and variant listings||variant|
Implementing unit price displaysAnchor link to section titled "Implementing unit price displays"
You should add support for unit prices wherever you have a price display. Common locations include:
- The collection template
- The product template
- The cart template
- The customers/order template
You can include this code in the relevant template or a section in the template.
Your code should do the following:
- Check whether the variant or line item has a unit price measurement using
- If the variant or line item uses a unit price measurement, display the unit price, the reference value, and the reference unit.