--- title: "How to add a Volume Pricing Widget to Product Pages" description: "Show your pricing tiers directly on your product page to help customers see how much they save when buying in bulk." url: https://help.mnmlapps.com/en/articles/4-how-to-add-a-volume-pricing-widget-to-product-pages collection: "Getting Started" updated: 2026-10-28 language: en --- # How to add a Volume Pricing Widget to Product Pages Show your pricing tiers directly on your product page to help customers see how much they save when buying in bulk. ### How to Add the Widget 1. **Go to Online Store → Themes** in your Shopify Admin. 2. Click **Customise** next to your active theme. 3. In the top bar, open the **page selector** and choose **Products → Default product** (or the template you use). 4. In the left-hand sidebar, click **Add Block**. 5. Select **Apps → Volume Pricing Widget**. ![](https://staticfiles.gleap.io/gattachments/cnDoiFv4cWbXYo0SEwlHgsMbrx6a9sk7hh8JS4xosiwJLFxZ4qozeyKnnBvLXqXOQJ97qFkt2xq.png) 6. Place it where you want it to appear - usually just below the variant selector or above the quantity field. ![](https://staticfiles.gleap.io/gattachments/abDxFUXxPGjc2cj3pePO6puiT6MMiPtoeFkPBDj5vfpuFixZipS4fEmRHLZFZ60FEg5hsTmCqXO.png) 7. Modify the settings to suit your requirements. ![](https://staticfiles.gleap.io/gattachments/LmKJhUUO9gxYwQWr0ot8Z8GqeGkqkci2GFu06Xp4Sykwbwf1TLA8y7cFnIU6fUqJGTjW0BprgyF.png) * * * ### How It Works - The widget displays each pricing tier, showing the quantity thresholds and discounted prices. - If a customer manually enters a quantity (e.g. typing “22” in the quantity box), the app automatically highlights and applies the correct tier - in this example, the **20+** tier. - When the customer adds the product to their basket, the app automatically applies the correct discount. - The widget automatically appears only for products that have pricing tiers set up. * * * ### Customisation Options You can fine-tune the widget’s design and layout directly in the Theme Editor.

Category	Setting	Description
General	Hide Default Quantity Selector	Hides your theme’s built-in quantity input when volume pricing is active.
Layout	Tier Content Alignment	Align tier content (left, centre, or right).
Colour Settings	Border, Background & Text Colours	Adjust all colours for normal, hover, and selected states.
Savings Display	Savings Label	Format savings using `[percentage]` or `[amount]`.
	Savings Style	Choose how to show savings: Hidden, Tag, Text, or Inline.
Display Options	Tier Quantity Label	Format the quantity label (e.g. `Buy [quantity]+`).
	Price Display Type	Show per-item or total pricing.
	Show Original Price	Optionally display the original crossed-out price.

* * * ### Notes - The widget currently supports **one main layout**. More widget styles will be available soon. - We can build **custom widgets** tailored to your theme or layout - just message us and we’ll create it for you.