Price Per Unit

If you're selling products that are available in different units/measurements you may want to break down your product prices by units. For example, you are required to show how much one gram of your coffee pack costs. Additionally, you can display how many units one product includes. You can set it up with the help of Price Per Unit and Units in product that will be shown on the product page.


You can choose any numbers and names, for example, you can set titles "Grams in one pack", "Price per gram", etc. These lines are product attributes of General type (Price per unit fields). So first you should configure these attributes and then specify their values for each product. Further instructions are below.

Enabling Price per Unit

To enable Price per Unit feature:

  1. From your Ecwid Admin, go to Settings → General page, Cart & Checkout tab.
  2. Enable the Show price per unit option.
  3. Save the changes.

Naming Price per Unit fields

You can enter your own titles for Units in product and Price per Unit fields in your Ecwid admin, Settings → Product Types . These values will be shown in your storefront.

The screenshot below shows an example of how these fields can be named in a store:


If you sell products in bottles, you can choose to name the fields “Liters in bottle” and “Price per liter.'' If you're selling several items in one pack, you can have fields "Items in pack" and "Price per one item".

Specifying Price per Unit values for products

To specify the values for Price Per Unit and Units in product for a product:

  1. From your Ecwid Admin, go to Catalog → Products.
  2. Choose or create the product.
  3. In the product editing page click on the arrow icon next to the price field. This will unfold the fields for the attributes that you set up in the product types.
  4. Specify the values that will be shown to your customers in the Price per Unit fields.
  5. Save the changes.


How to modify the font and color of the "Price per unit" fields?

These fields have CSS class, so you can edit them with the help of CSS. Use this CSS code to change the font size and color of text in the Price Per Unit section that is shown on product pages:

.ec-size .ec-store .product-details__price-per-unit-block  {
    font-size: 11px;
    color: #11808a;

Replace 11px and #11808a in the above code with the values you need and add this CSS code to your store theme.

German laws require the price per unit to be shown on the product list

If your store address is German and your storefront is visited by a customer from Germany (Ecwid will determine that automatically), Price per Unit fields will be displayed on the product listing pages, too.

Was this article helpful?

Awesome! Thanks for your feedback!

Thanks for your feedback!

Sorry about that! What went wrong?
18 out of 40 found this helpful
We use cookies and similar technologies to remember your preferences, measure effectiveness of our campaigns, and analyze depersonalized data to improve performance of our site. By choosing «Accept», you consent to the use of cookies.
Accept cookies Decline