Skip to main content

Show the right price on your product page

Make your theme's price follow the tier a shopper picks, and hide your theme's quantity box.

Step 3 of the offer editor, Look and texts, has a group called Your theme's product page. It changes your theme's own page around a volume discount. The price changes show on your store, not in the editor's preview. To open it, click Bundles & Discounts in the app, open a volume discount, and click Look and texts in the steps on the left. How the offer looks has its own guide, and so do its option texts and names.

What this video covers

  • Hide your theme's quantity selector removes your theme's quantity box on products where the offer shows, because shoppers pick a quantity with the tiers. It's the only setting in this group that works on the Legacy widget.

  • Show the tier's price in your theme's price makes your theme's price follow the tier a shopper picks. Switch it on and its settings appear. On the Legacy widget it's unavailable: the app asks you to choose Modern under Widget version.

  • Find your theme's price automatically is for Dawn and themes built on it. Turned on, it finds the price, full price and sale badge without CSS, and the boxes for those three hide. A selector you fill in is used first, even with automatic on.

  • Price selector takes the CSS selector of your theme's price. Until you fill it in, nothing on your product page changes, and a warning says so. To find it, right-click the price on your product page and choose Inspect. On the Horizon theme in the video it is product-price .price.

  • Add the full price and savings beside it adds the full price, crossed out, and a savings badge next to your theme's price. Two text rows appear: Theme price badge, shown when the picked tier saves money (leave it empty to use the tier's Savings badge), and Theme price badge with a subscription, used instead when a shopper picks a subscription. Both have Variables and Translate.

  • Compare-at price selector points at your theme's own crossed-out price (leave it empty to use .original-price), and Discount badge selector at its sale badge, such as -3%. They make those show the tier's full price and discount, but only while Add the full price and savings is off.

  • Button price selector adds the tier's price to a button's label, as in "Add to cart | $59.95". Automatic doesn't find buttons, so fill it in even on Dawn. On the Horizon theme in the video it is .product-form-buttons .add-to-cart-button.

  • Price shown picks the price your page and button show: Tier total or Price per item.

  • On your store: after Save, give it a few seconds to go live. The quantity box is gone. With 2 items picked, the price under the title reads $32.40 with $36.00 crossed out and Save $3.60, and the button reads Add to cart | $32.40. Pick 3 items and it follows: $45.90, $54.00 crossed out and Save $8.10. With Price shown on Price per item, 2 items show $16.20 on the page and the button.

In short

  • Hide your theme's quantity selector works on every widget version; the price settings need the Modern widget.

  • With Show the tier's price in your theme's price on, fill in Price selector, or on Dawn switch on Find your theme's price automatically. With neither, nothing on your product page changes.

  • Button price selector is never found automatically: fill it in even on Dawn.

  • Price shown sets the price your page and button show: Tier total ($32.40 for 2 items in the video) or Price per item ($16.20).

  • After Save, give it a few seconds before you check your store.

Did this answer your question?