> For the complete documentation index, see [llms.txt](https://help.inspiredtheme.com/articles/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.inspiredtheme.com/articles/sections/theme-sections/product-bundle.md).

# 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.

***

{% hint style="warning" %}
**Pro feature.** This section requires a Pro or Max License key. Without one, it's hidden on your live store and shows a 🔒 Pro notice in the theme editor. [Learn about plans and License keys](/articles/general-information/license-key-and-plans.md)
{% endhint %}

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:

{% hint style="info" %}
**Steps:**

* In the theme editor, click **Add section.**
* Locate **Product bundle.**
* Click **Save.**
  {% endhint %}

<figure><img src="https://1670075522-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F6M5ltDUBhmgWKXclaWBK%2Fuploads%2FSM0QjK6cNKXuy5GITNxJ%2FScreenshot%202026-04-21%20at%204.20.29%E2%80%AFPM.png?alt=media&#x26;token=95cc8c11-4f7f-408b-824a-21344197c91b" alt=""><figcaption></figcaption></figure>

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

### 2. Section settings

<figure><img src="https://1670075522-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F6M5ltDUBhmgWKXclaWBK%2Fuploads%2FXdrRMXG4HgGdcjpYKzvT%2FScreenshot%202026-04-21%20at%204.42.57%E2%80%AFPM.png?alt=media&#x26;token=33b062c5-7ba1-4d41-97ad-f83b4f0290aa" alt=""><figcaption></figcaption></figure>

* **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.

{% hint style="warning" %}
The discount is shown in the section only. The products are added to the cart at their regular prices. To give shoppers the bundle price at checkout, create a matching automatic discount in your Shopify admin under **Discounts**.
{% endhint %}

### 3. Product block settings

<figure><img src="https://1670075522-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F6M5ltDUBhmgWKXclaWBK%2Fuploads%2FeiqacySdT9GGY00rdh3X%2FScreenshot%202026-04-21%20at%204.43.37%E2%80%AFPM.png?alt=media&#x26;token=5ba3a139-267a-4faa-9993-d46f4c85f91a" alt=""><figcaption></figcaption></figure>

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](/articles/sections/theme-sections/bundle-builder.md).