# Collection tabs

<figure><img src="https://1556176885-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FPgk3wauuyAKlfkLLpBvA%2Fuploads%2Fk8gvOl9rpF6WbmWBZNny%2Fcl-tab.jpg?alt=media&#x26;token=5e3b5acb-4ec4-4987-a5e3-b521643ec92d" alt=""><figcaption></figcaption></figure>

{% hint style="success" %}
**Steps:**&#x20;

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

### General settings

<figure><img src="https://1556176885-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FPgk3wauuyAKlfkLLpBvA%2Fuploads%2Fn3x2EcMbMIRhA0bqJCbi%2Fcl-g.jpg?alt=media&#x26;token=5e6dc7eb-96f0-42ae-969e-c9e850cd6507" alt=""><figcaption></figcaption></figure>

* **Width** - With of this section 3 options : Container / Stretched / Full width
* **Subheading**&#x20;
* **Heading** - Heading of this section
* **Heading size** - From Heading 1 to Heading 6
* **Description** - Description of this section
* **Uppercase tab headings**
* **Tabs font family** - Headings font / Body font
* **Layout** - *Horizontal / Vertical*

### Grid settings

<figure><img src="https://1556176885-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FPgk3wauuyAKlfkLLpBvA%2Fuploads%2FFJQyxNgTFbvIbguLRYbd%2Fcl-gr.jpg?alt=media&#x26;token=4ddec3a2-7ef1-4a9f-9065-e20e5840e921" alt=""><figcaption></figcaption></figure>

* **Stack products** -  Display products in a grid layout. ( If disable Layout products is carousel )
* **Show carousel progress bar**
* **Enable overflow visible** - When this feature is enabled, the Carousel will be allowed to overflow from the container
* **Products to show**
* **Products per row (desktop)**

### Mobile Layout

<figure><img src="https://1556176885-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FPgk3wauuyAKlfkLLpBvA%2Fuploads%2FMWUREuNaVD8qTN7GsFLF%2Fcl-mb.jpg?alt=media&#x26;token=fb3944e0-f58f-4325-985c-52c2ba7c475d" alt=""><figcaption></figcaption></figure>

* **Columns on mobile** : 1 column / 2 columns ( When stacked products are enabled.)
* **Enable swipe on mobile**

### Colors

<figure><img src="https://1556176885-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FPgk3wauuyAKlfkLLpBvA%2Fuploads%2FcGzFhXVgxpuLwPNSyDdy%2Fcolor-c.jpg?alt=media&#x26;token=3cb90b75-d723-4021-b6c1-808b5fcedadc" alt="" width="280"><figcaption></figcaption></figure>

* **Background**
* **Text color**

### Section padding

<figure><img src="https://1556176885-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FPgk3wauuyAKlfkLLpBvA%2Fuploads%2Fc0cazMLYpU5yjLuS4vGl%2Fpadding-c.jpg?alt=media&#x26;token=d8c91b56-445e-4ea5-bbc5-f825cf08e577" alt="" width="280"><figcaption></figcaption></figure>

* **Top padding**
* **Bottom padding**

## **Block settings**

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

1. Locate **Slideshow.**
2. **Add Collection**
3. Make necessary changes. > **Save.**
   {% endhint %}

<figure><img src="https://1556176885-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FPgk3wauuyAKlfkLLpBvA%2Fuploads%2FcOH4gZwMPUwufFXHXbaU%2Ftab-block.jpg?alt=media&#x26;token=8302b599-6249-436a-b2c2-716a38058a37" alt=""><figcaption></figcaption></figure>

* **Collection** - Select Collection
* **Tab Heading** - Custom tab heading