The [chamevo_pricing_breakdown] shortcode renders a live pricing summary on the product page. As customers customize the product — adding text, uploading images, choosing colors — the breakdown updates in real time to show how the final price is calculated.

Before you start

• You need at least one Dynamic Pricing rule configured. Without pricing rules, the breakdown has nothing to display. See Dynamic Pricing overview to set up pricing rules first.
• The product customizer must be on the same page. The breakdown connects to the running customizer — it does not work standalone.

What the breakdown shows

The pricing breakdown lists each active pricing rule as a line item, with the current calculated value next to it. The total updates as the customer makes changes.

What appears in the breakdown depends on your pricing rule configuration. Typical line items include:

• Base product price
• Text length charge (if you charge per character or per line)
• Font size charge (if price varies by font size)
• Image size charge (if you charge based on upload dimensions)
• Color count charge (if you charge per number of colors used)
• Per-element prices (fixed prices assigned to specific design elements)

The breakdown is driven entirely by your Dynamic Pricing rules. If a rule is active and its condition is met, it appears as a line item.

Add the shortcode

The shortcode takes no attributes:

[chamevo_pricing_breakdown]

On a WooCommerce product page

For WooCommerce products, paste the shortcode in the Product short description field to place it in the product summary area:

1. Open the product in WooCommerce → Products → Edit product.
2. Paste [chamevo_pricing_breakdown] in the Product short description field.
3. Update the product.

The breakdown renders in the short description area, typically between the product title and the Add to Cart button.

For a different position — such as below the Add to Cart button or in a custom sidebar column — use Elementor or another page builder.

On a standalone page with [chamevo]

For pages that use the [chamevo] shortcode (without WooCommerce), place the pricing breakdown shortcode wherever you want the summary to appear:

[chamevo]
[chamevo_pricing_breakdown]

Or in a custom layout:

[chamevo]

## Your order summary

[chamevo_pricing_breakdown]

[chamevo_form]

Elementor equivalent

If you build product pages with Elementor, use the Chamevo Pricing Breakdown widget instead of the shortcode. It offers the same output through a visual drag-and-drop interface.

The widget is in the Chamevo category in the Elementor widget panel.

In the Elementor editor, the widget shows an info placeholder. The live breakdown renders on the frontend.

See Use Chamevo with Elementor for details on building layouts with Chamevo widgets.

Check your setup

1. Open the product page on the frontend.
2. Verify the pricing breakdown renders at the shortcode position.
3. Make a change in the customizer — add text, upload an image, or change a color.
4. Confirm the breakdown updates to reflect the new price.
5. Add the product to the cart and verify the cart total matches the breakdown total.

Troubleshooting

Nothing renders where the shortcode is placed

• The customizer is not on the page. The breakdown connects to the running customizer. It needs [chamevo] on the same page, or a WooCommerce product page with Chamevo enabled.
• No pricing rules configured. The breakdown requires at least one active Dynamic Pricing rule. Go to Chamevo → Pricing Rules and confirm rules are set up and active for this product.
• Caching. Clear your page cache after adding the shortcode.

The breakdown appears but shows no line items

• Confirm your pricing rules are assigned to this product and are active.
• Make a customization change to trigger the pricing calculation. Some rules only activate when a condition is met — for example, a text length rule only fires once a text element contains characters.

The breakdown total does not match the cart total

• Check that the WooCommerce product price includes or excludes the base price correctly in your pricing rule setup.
• Review your Dynamic Pricing rule configuration in Chamevo → Pricing Rules to ensure rule groups are set to accumulate rather than first-match if multiple rules should apply.

Next steps

• Dynamic Pricing overview — configure the rules that drive the breakdown.
• Create pricing rules for text properties — charge by character count, line count, or font size.
• Set prices for individual design elements — add fixed prices per element.
• Use Chamevo with Elementor — place the breakdown visually with the Elementor widget.

FAQ

Q: Does the pricing breakdown replace the WooCommerce product price display? A: No. The breakdown is an additional component. The WooCommerce price display (above the Add to Cart button) still shows the product price as configured in WooCommerce. The breakdown provides an itemized view of how the customization price is built up.

Q: Can I place the breakdown inside the customizer layout instead of outside it? A: The shortcode places the breakdown outside the customizer canvas, in any position on the page. To show a price summary inside the customizer UI itself, configure the pricing display through the UI Composer in Chamevo → UI Composer.

Q: Does the breakdown work without Dynamic Pricing rules? A: No. The breakdown component is designed to show rule-based price calculations. Without pricing rules, there is nothing to display and the component renders empty.