# Collage tab

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

Use the **Collage tabs** section to organize content into horizontal tabs, each with its own image and message. Perfect for highlighting multiple promotions, collections, or brand categories without overwhelming your homepage.

<Hint type="info">

This section is available on ✨ **Zest version 7.0.0 onwards**. See our [Changelog](/zest-theme/changelog)

</Hint>

## How to add a Collage tab section to your Shopify store

<Hint type="success">

**Steps:**

1. In the theme editor **(Customize)**, click **Add section**
2. Select **Collage tabs**
3. Make necessary changes
4. **Save.**

</Hint>

## How to edit a Collage tab section

### Section settings

<Table widths="270,auto">

| Setting | Description |
| --- | --- |
| **Heading size** | Controls the tab title text size. |
| **Desktop navigation alignment** | Position of the tab navigation bar (Left / Center / Right). |
| **Desktop image position** | Left or Right alignment of the image relative to text. |
| **Desktop image width** | Adjust how much space the image takes (in %). |
| **Image ratio** | Maintain consistent height with Fixed ratio or match original image with Adapt to image. |

</Table>

![image](https://docs-assets.foxecom.app/zest-theme/image_ZsEFaViV.png)

![image](https://docs-assets.foxecom.app/zest-theme/image_y2SYyNev.png)

### Block settings

Each tab is a block inside the section. You can add multiple.

| Setting                   | Description                                                                                                                                                                                         |
| ------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Color scheme**          | <p>Choose from your theme’s predefined color schemes for background/text.<br/>Learn how to add color schemes: [Colors & Color schemes](https://docs.foxecom.com/zest-theme/theme-settings/colors-and-color-schemes)</p> |
| **Navigation title**      | The name that appears in the tab navigation bar. Keep it short.                                                                                                                                     |
| **Image**                 | Upload a high-quality image to visually represent the content.                                                                                                                                      |
| **Heading / Subheading**  | Main messaging. You can bold, italicize, or highlight text.                                                                                                                                         |
| **Description**           | Add supporting text, product info, or promotional messages.                                                                                                                                         |
| **Text alignment**        | Aligns heading, subheading, and description (Left / Center / Right).                                                                                                                                |
| **Button label**          | Add a call-to-action (e.g. “Shop Now”). Leave blank to hide.                                                                                                                                        |
| **Button link**           | Paste the URL or use Shopify’s link selector.                                                                                                                                                       |
| **Button style**          | Choose between primary, secondary, white or underline button.                                                                                                                                       |
| **Mobile text alignment** | Option to override desktop text alignment on mobile.                                                                                                                                                |

![image](https://docs-assets.foxecom.app/zest-theme/image_aaPOQmdY.png)

## Best practices

* **Stick to 2–3 tabs** to avoid overwhelming shoppers.
* Use **cohesive visuals** across tabs to maintain brand consistency.