For the complete documentation index, see llms.txt. This page is also available as Markdown.

Product bundle

Group up to three products into one offer with a single "Add bundle to cart" button. Use it to raise your average order value.


The Product bundle section shows an image next to up to three products, their combined price and the amount shoppers save. One button adds the whole bundle to the cart.

1. Our guide to set up a Product bundle section:

Steps:

  • In the theme editor, click Add section.

  • Locate Product bundle.

  • Click Save.

The section is added with three Product blocks, the maximum.

2. Section settings

  • Image settings

    • Image and Mobile image: The bundle image for desktop, and an optional different image for phones.

    • Desktop image height: Adapt to image / 250px / 350px / 450px / 550px / 650px / 750px / 850px.

    • Mobile image height: Adapt to image / 150px / 250px / 350px / 450px / 550px / 650px / 750px.

    • Desktop image placement: Image left / Image right.

    • Enable sticky content on desktop: Keeps the bundle details in view while shoppers scroll past the image.

  • Section header

    • Subheading: A short line above the heading, for example Bundle & Save.

    • Heading: The title of the bundle.

    • Heading size: 15–80px.

    • Heading alignment: Left / Center.

  • Discount

    • Discount type: Percentage / Fixed amount. Percentage takes a percentage off the bundle total. Fixed amount takes a set amount, in your store's currency, off the bundle total.

    • Value: 10–100, in steps of 5. A percentage or an amount, depending on Discount type.

  • Colors

    • Color scheme: The colors of the section's background, text and button.

  • Corner radius

    • Corner radius: Rounds the bundle image, 0–40px.

  • Section padding

    • Top padding and Bottom padding: 0–100px.

3. Product block settings

Each block is one product in the bundle. Shoppers can choose a variant for each one.

  • Product: The product to include.

  • Product card

    • Font size scale: Size of the product title, 100–200%.

    • Image ratio: Adapt to image / Portrait / Square / Arch.

    • Show second image on hover: Shows the product's second image when shoppers hover over it.

    • Show image border: Adds a border around the product image.

    • Show vendor: Shows the product's vendor.

4. Tips

  • Choose products that are often bought together, and state the saving in the Heading (for example Buy set of 3 and save 10%).

  • Keep the Discount settings and your Shopify automatic discount in sync, so the price shoppers see matches the price at checkout.

  • Want discounts that grow with the number of items shoppers pick? Try Bundle builder.

Last updated

Was this helpful?