# Products bundle

![image](https://docs-assets.foxecom.app/zest-theme/Fox-BG%20Light%20(51)_dItvzLcr.jpg)

Display a group of products that work well together—like a makeup set, outfit combo, or skincare routine. Each item is highlighted visually using numbered hotspots over an image, helping customers understand how the products complement one another. 

Perfect for cross-selling and increasing average order value.

## How to add a Products bundle section to your Shopify store

<Hint type="success">

**Steps:**

1. In the theme editor (**Customize**) > click **Add section**
2. Select **Products bundle**
3. Make necessary changes
4. **Save.**

</Hint>

<Hint type="info">

All items included in the bundle will be added to the card when using 'Add All to Cart' button.

To change the button label, go to **Actions > Edit default theme content**. \
![](https://docs-assets.foxecom.app/zest-theme/image_VYyCmp5C.png)

</Hint>

## How to edit a Products bundle

### Section settings

<Table widths="245,auto">

| Setting | Description |
| --- | --- |
| **Image** | Upload an image that includes all products in the bundle.<br/><img src="https://docs-assets.foxecom.app/zest-theme/image_eSaWcKG3.png" alt="image" /> |
| **Image position** | Choose whether the image appears on the left or right. |
| **Subheading / Heading** | Add compelling copy to introduce the bundle. |
| **Highlighted text** | Emphasize part of the heading using highlight styling.<br/>[Highlight text](https://docs.foxecom.com/zest-theme/pages-global-sections/general-settings#highlight-text) |
| **Desktop &#x26; Mobile Padding** | Control spacing inside the section. |
| **Content alignment** | Align content left, center, or right. |

</Table>

### Block settings

<Table widths="245,auto">

| Setting | Description |
| --- | --- |
| **Product** | Select a product from your catalog. |
| **Hotspot color** | Set to **Light** or **Dark** for visibility on the image.<br/>• Light: <img src="https://docs-assets.foxecom.app/zest-theme/image_gOIDOxHp.png" alt="image" /><br/>• Dark: <img src="https://docs-assets.foxecom.app/zest-theme/image_MNfFDOvN.png" alt="image" /> |
| **Horizontal / Vertical position** | Adjust where the numbered dot appears on the image. |

</Table>