Price Breakdown Rows
One product's retail price split into cost rows with proportion bars, a note per line, and the margin admitted.
One product's retail price split into cost rows with proportion bars, a note per line, and the margin admitted.
The source for every Ecommerce block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
Price Breakdown Rows opens the cost sheet of one flagship product, the full retail price split into rows with proportion bars, a note per line, and the margin admitted rather than hidden. The lede states the stakes, a price you cannot inspect is just a number.
Lines are one array of label, amount, share, and note, summed to a full retail total. The margin row is the content, a breakdown that stops before profit is only marketing.
Reach for this block on a pricing transparency page or a product page for makers whose costs are genuinely a strength. Every note should carry a source or a number, the bars turn the sheet into something a buyer can read at a glance.
A natural flow around it on an Ecommerce Pro page:
Before
After
One strong use is a product cost sheet down to margin. Other breakdowns:
Tip: the margin row does the real work, a breakdown that names its own profit is the line competitors will not print.