Price Summary Display

Price Summary Display

Overview

The price summary is the breakdown panel customers see alongside your calculator on the storefront. It shows how the final price is composed — options, fees, discounts, and total. You control which fields appear and how the summary is displayed. Configuration has two parts: choosing which fields to show (in the Calculator AI app) and enabling the summary on your storefront (in the Shopify Theme Customizer).

Steps

1. Configure which fields to show

  1. Open your calculator in the editor and go to Calculator Editor → Optional Features → Price Summary.
  2. Toggle each field on or off using the checkboxes.
  3. The live preview updates immediately so you can see how the summary looks.
  4. For the Options field, you can further customize which individual options and variables are listed, reorder them, and rename their labels.
  5. If you have languages enabled, click the translate icon next to any field to manage its translations.

2. Enable the summary on your storefront

The price summary does not appear on your storefront until you enable it in the Shopify Theme Customizer. There are two ways to display it:

Option A: Built-in to the calculator block — Open the Shopify Theme Customizer, select the CalcAI Calculator block, and check Show price summary in the block settings. You can then choose where the summary appears relative to the calculator (above, below, left, or right) and adjust the spacing and width.

Option B: Separate theme block — Add the CalcAI Price Summary block to your page template in the Theme Customizer. This places the summary independently from the calculator, so you can position it anywhere on the page — for example, in a sticky sidebar.

Details

Available Fields

Field What it shows
Options Individual option prices and their labels.
Quantity The selected quantity.
Subtotal Price before discounts.
Quantity Discount The active quantity-tier discount when a threshold is met.
Discounts Calculator-level discounts applied to the subtotal.
Fixed Fees Individual fixed fee line items and their amounts. Each fee is shown separately.
Total The final price after all discounts.
Unit Price Price per unit — most useful with per-unit granularity calculators.

Options Detail

When "Options" is enabled, you can fine-tune which specific options and pricing variables appear in the summary. Use the Add item dropdown to include options or variables, drag to reorder, and edit the display label for each.

You can also enable Show price difference text to display how each option choice affects the price relative to the base selection.

CalcAI Calculator Block Summary Settings

When you enable Show price summary in the CalcAI Calculator block, these additional settings appear:

Setting Description
Summary position Where the summary appears relative to the calculator: Above, Below, Left, or Right.
Summary spacing The gap between the calculator and the summary (0–60 px).
Summary width How wide the summary panel is when positioned left or right (20–80%).

Examples

  • Simple calculator — You enable only the Total field and check Show price summary in the CalcAI Calculator block. The customer sees one clean price number below the calculator.
  • Detailed quote with sidebar summary — You enable Options, Subtotal, Quantity Discount, Discounts, Fixed Fees, and Total. In the Theme Customizer, you set the summary position to Right with 40% width, giving the customer a full cost breakdown alongside the calculator.
  • Sticky sidebar summary — You add the CalcAI Price Summary block to a sticky sidebar section in your theme, separate from the calculator. The summary stays visible as the customer scrolls through a long calculator form.

    • Related Articles

    • Quantity option: inline price

      Overview For Quantity options using Dropdown or Radio list, you can enable Show price and discount inline. Shoppers then see the product line price for each fixed quantity (and for Custom, when a valid quantity is entered). Amounts use the same rules ...

    • Initial Price (Base Price)

      In the editor, this section is labeled Initial Price. The dropdown inside it is labeled Base price. Overview Initial Price sets the calculator’s base—the starting dollar amount the app uses before stacking option prices and (optionally) your Unit ...

    • Price Adjustments

      Overview Price adjustments are conditional rules that modify the calculated price when certain conditions are met. Each adjustment combines one or more conditions with a formula, letting you add surcharges, apply multipliers, or set overrides based ...

    • Total Price Formula

      Overview The Unit price calculation / Total price calculation field (this section is titled Total Price Formula in the nav) is the main place you define how the line price is computed from options and base. You can also set minimum and maximum price ...

    • Fixed Fees

      Overview Fixed fees are extra charges added on top of the calculated product price. They can be a flat amount (e.g., a $5 handling fee) or a dynamic amount driven by a formula (e.g., a rush-order surcharge that only applies when the customer selects ...