# Collection tabs

<figure><img src="https://3026705042-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAJrvmfqcj9TMoPkl3bNc%2Fuploads%2FYpOM41B3um81LVmffuGL%2FHyper%20docs%20screenshot%20do%20not%20delete%20(11).jpg?alt=media&#x26;token=c67368cd-86ec-46fa-9b81-74fa4643e8f0" alt=""><figcaption></figcaption></figure>

The Collection tabs section is designed to highlight specific collections through a unique layout and smooth visual effects. This feature helps to effectively convey information about the collection, capturing the attention of visitors and encouraging them to explore the products further.

## How to add a Collection tabs section to your Shopify store

{% hint style="success" %}
Steps

1. In the theme editor **(Customize)**, click **Add section.**
2. Select **Collection tabs** section.
3. Make necessary changes.
4. **Save** the settings.
   {% endhint %}

## How to edit a Collection tabs section

### Section settings

<figure><img src="https://3026705042-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAJrvmfqcj9TMoPkl3bNc%2Fuploads%2FwzNQwIOtDGvwIFVPA7qf%2Fimage.png?alt=media&#x26;token=2fd390db-6c45-408b-9a2f-c3b7c68a9843" alt=""><figcaption></figcaption></figure>

#### Section header

Give the section a **Heading** and adjust the **Heading size**.

#### Tabs settings

* **Desktop image position**:

{% tabs %}
{% tab title="Left" %}

<figure><img src="https://3026705042-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAJrvmfqcj9TMoPkl3bNc%2Fuploads%2Fo3DSoNBb3FPldSgws2db%2Fimage.png?alt=media&#x26;token=208e99de-387c-41c1-954b-0e60c512e7fd" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Right" %}

<figure><img src="https://3026705042-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAJrvmfqcj9TMoPkl3bNc%2Fuploads%2FDKbQDOYstICNU7mA3eTu%2Fimage.png?alt=media&#x26;token=49bef600-6d79-494e-96e5-d3334820fc47" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

You can also adjust the **Image ratio** and **Collection titles' size**.

<figure><img src="https://3026705042-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAJrvmfqcj9TMoPkl3bNc%2Fuploads%2F3O8ACHzIxGWnvj1TGg09%2Fimage.png?alt=media&#x26;token=efa5c04c-ed64-49c6-b55a-341678996c82" alt=""><figcaption></figcaption></figure>

### Block settings

For each collection block, select a Collection, a Featured image, and insert the content for it.

{% hint style="info" %}
The section will automatically display the first 4 products of the selected collection.
{% endhint %}

<figure><img src="https://3026705042-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAJrvmfqcj9TMoPkl3bNc%2Fuploads%2FRJRQlM9ZEuFqxrdVniCf%2Fimage.png?alt=media&#x26;token=eea8f21a-7db8-4241-a463-b6990f8c58d1" alt=""><figcaption></figcaption></figure>

***

<figure><img src="https://3026705042-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAJrvmfqcj9TMoPkl3bNc%2Fuploads%2FkUIzEsJKOeRiz891zyf5%2Flivechat883x471%20(1).png?alt=media&#x26;token=90cbed2c-e791-49c8-9f43-49a08bed6f1f" alt=""><figcaption><p><a href="https://apps.shopify.com/xflow?utm_source=foxecom&#x26;utm_medium=help_center_hyper&#x26;utm_campaign=banner">Install XFlow Back In Stock Automation FREE</a></p></figcaption></figure>
