> For the complete documentation index, see [llms.txt](https://nextsky.gitbook.io/purity-theme/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://nextsky.gitbook.io/purity-theme/group-sections/products/product-tabs.md).

# Product tabs

The **Product tabs** section allows you to create multiple tabs, each with a corresponding collection, providing a dynamic way to display content.

<figure><img src="https://1059363070-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRcDJSoM26kdEZlVFekVW%2Fuploads%2FNCoMZowZp6k2DHw7NxPt%2FScreenshot_98.png?alt=media&amp;token=e21b7906-9e29-449c-b9ef-230795532fde" alt=""><figcaption></figcaption></figure>

### Section settings

#### General settings

<table data-full-width="false"><thead><tr><th width="215.199951171875">Setting</th><th>Description</th></tr></thead><tbody><tr><td><strong>Color scheme</strong></td><td>Select colors from <strong>Theme settings -> Colors</strong></td></tr><tr><td><strong>Subheading</strong></td><td>Subheading content</td></tr><tr><td><strong>Heading</strong></td><td>The title of the section</td></tr><tr><td><strong>Enable heading underline animation</strong></td><td>Enable heading underline animation</td></tr><tr><td><strong>Underline style</strong></td><td>Select Underline style</td></tr><tr><td><strong>Underline color</strong></td><td>Customize Underline color</td></tr><tr><td><strong>Description</strong></td><td>The description of the section</td></tr><tr><td><strong>Heading size</strong></td><td><p>The size of the title:</p><ul><li><strong>Small</strong></li><li><strong>Medium</strong></li><li><strong>Large</strong></li></ul></td></tr><tr><td>Alignment</td><td><p>The position of the heading and description.</p><ul><li><strong>Left</strong></li><li><strong>Center</strong></li><li><strong>Right</strong></li></ul></td></tr></tbody></table>

#### Carousel settings <a href="#settings-for-carousel" id="settings-for-carousel"></a>

<table><thead><tr><th width="215">Setting</th><th>Description</th></tr></thead><tbody><tr><td><strong>Maximum items to show</strong></td><td>Limit the display of the number of posts. Minimum: 2. Maximum: 12.</td></tr><tr><td><strong>Items per row on desktop</strong></td><td>Number of columns to display on desktop.</td></tr><tr><td><strong>Column gap</strong></td><td><p>4 options for column gap</p><ul><li><strong>No gap</strong></li><li><strong>Small</strong></li><li><strong>Medium</strong></li><li><strong>Large</strong></li></ul></td></tr><tr><td><strong>Show navigation</strong></td><td>Display the next and back controls for the carousel</td></tr><tr><td><strong>Show pagination</strong></td><td>Display the pagination for the carousel</td></tr><tr><td><strong>Reveal next slide</strong></td><td>Display a part of the upcoming slide.</td></tr></tbody></table>

#### Mobile options

<table><thead><tr><th width="215">Setting</th><th>Description</th></tr></thead><tbody><tr><td><strong>Items per row on mobile</strong></td><td>Number of columns to display on mobile devices.</td></tr></tbody></table>

#### Block setting <a href="#section-padding" id="section-padding"></a>

<table data-full-width="false"><thead><tr><th width="214.79998779296875">Setting</th><th>Description</th></tr></thead><tbody><tr><td><strong>Show view all button</strong></td><td>Show view all button</td></tr><tr><td><strong>Hide tab description on mobile</strong></td><td>The description on every tab will be hidden on mobile devices</td></tr></tbody></table>

#### Section padding <a href="#section-padding" id="section-padding"></a>

<table><thead><tr><th width="215">Setting</th><th>Description</th></tr></thead><tbody><tr><td><strong>Top</strong></td><td>Customize the top margin of the section</td></tr><tr><td><strong>Bottom</strong></td><td>Customize the bottom margin of the section</td></tr></tbody></table>

### Block settings

<table><thead><tr><th width="215">Setting</th><th>Description</th></tr></thead><tbody><tr><td><strong>Collection</strong></td><td>Select the collection you want to display</td></tr><tr><td><strong>Title</strong></td><td>Title of each tab</td></tr><tr><td><strong>Description</strong></td><td>Description of each tab</td></tr></tbody></table>
