Grocery and coffee shops
Show the price per kg beside bags of different sizes.
Commerce / widget · Elementor module
Product Price Per Weight Widget Plugin for Elementor
Show a WooCommerce product's unit price, such as “£24.00 per kg”, worked out from its price and the weight in its Shipping tab.
Included in All AccessClassic Elementor widgetFrom $29 USD / year
Complementor / Product price per stored weightProduct preview
Text, style and layout controls inside Elementor
01 / Interactive demonstration
Real unit prices
These are the actual published outputs of the widget for sample products.
02 / Inside WordPress
Product price per stored weight controls in Elementor
Source picks the current product or a selected one. Display sets the unit (the shop's weight unit, kilogram, 100 grams, gram, pound or ounce), the text before, the wording with {price} and {unit}, the word for products with options and an icon. Style covers the text and surface, the unit price and the icon.
03 / Website use cases
Where to use product price per stored weight
Shoppers comparing a 250 g bag with a 1 kg bag want the price per kilo, and in many countries food shops are expected to show it. WooCommerce stores each product's weight but never shows a unit price. Product price per stored weight divides the price shoppers see by the product's weight and shows it per kilogram, 100 grams, gram, pound or ounce, converting from the shop's weight unit. Products with options show the lowest unit price among them.
Tea and spice sellers
Compare small tins per 100 g.
Shops selling in pounds
Show prices per lb or oz from the same weights.
04 / Installation and setup
How to show a price per kg in Elementor
Start with Complementor installed and your license connected. Enable this module in the WordPress library, then configure it in Elementor.
Install Complementor, connect your license and enable Product price per stored weight in the Complementor library.
In each product's Shipping tab, enter the weight of the contents.
Add the widget to a single product template, or to any page with Source set to a selected product.
Under Display, choose the unit and edit the wording.
Style the text and unit price under Style, then check a product with options.
05 / Content and style controls
Customize product price per stored weight in Elementor
Configure the settings available for this module to suit the page you are building.
Current product on product pages and templates, or any selected published product.
Price per the shop's weight unit, kilogram, 100 grams, gram, pound or ounce, converted from the stored weight.
Wording with {price} and {unit}, such as “£24.00 per kg” or “£2.40/100 g”, and text before it.
Uses the price shoppers see: sale prices and WooCommerce's tax display.
Products with options show the lowest unit price with editable “From” wording.
Very small unit prices keep four decimals so per-gram prices do not round to zero.
Text, surface and unit price styles, and an optional icon.
06 / Choose the right approach
Product price per stored weight and Elementor alternatives
Compare the existing Elementor workflow with this Complementor module before choosing your setup.
Writing the unit price in the description
Fine for a few products, but it goes wrong as soon as the price or a sale changes.
A unit-price or German Market style plugin
Stores a separate base unit and amount per product; prefer it when the shipping weight cannot be the content weight or legal labelling rules need more.
07 / Requirements and compatibility
Product price per stored weight compatibility with Elementor
- Requires Elementor and WooCommerce.
- Weight only (kg, 100 g, g, lb, oz); no volume or piece units.
- Uses the Shipping-tab weight, which must be the content weight for an accurate unit price.
Complementor uses classic Elementor APIs. Atomic-native controls are not implemented. Check your theme, cache and integrations on a staging site before release.
08 / Common setup problems
Troubleshoot product price per stored weight
Check these settings if the published page behaves differently from the editor.
Why does nothing show on a product?
The product needs a price and a weight in its Shipping tab; the editor says which is missing.
Why is the unit price too low?
The Shipping weight includes packaging. Enter the weight of the contents for a true unit price.
Why does it say “From”?
The product's options have different unit prices, so the lowest is shown.
Why is the unit pounds by default?
The default follows the weight unit under WooCommerce › Settings › Products; choose kilogram or another unit under Display.
Product price per stored weight plugin questions
Does it need Elementor Pro?
No. It works with the free version of Elementor and WooCommerce.
Which weight does it use?
The weight in the product's Shipping tab (or each option's own weight).
Does it follow sale prices and tax settings?
Yes. It divides the price as WooCommerce shows it in the shop.
Can I show it per 100 g?
Yes. Choose 100 grams under Price per.
Does it work for liquids?
No. It uses weight only; there is no per-litre option.
10 / Annual All Access subscription
Get product price per stored weight with Complementor
This module is included with all 1007 current Complementor solutions. Choose your production website allowance; every plan includes the same modules.
One website
$29USD / year
- All 1007 current modules
- Plugin downloads and updates for one year
- New releases during the paid term
- Product support
Renews at $29 USD each year.
A few websites
$49USD / year
- All 1007 current modules
- Plugin downloads and updates for one year
- New releases during the paid term
- Product support
Renews at $49 USD each year.
More websites
$99USD / year
- All 1007 current modules
- Plugin downloads and updates for one year
- New releases during the paid term
- Product support
Renews at $99 USD each year.
Applicable taxes extra. Annual subscriptions renew automatically unless canceled in your customer account. Elementor Pro is required for Exclude current post. Read the terms and 14-day technical-issue refund policy.