# Collection list

The collection list is an interactive showcase for your handpicked collections. With rich customization options, you can captivate your audience and urge them to explore more.

<figure><img src="https://891064830-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fz8oqtXqtdhOM4CxRzekr%2Fuploads%2Fvz5sJ0XxLTI9In9HSjzG%2Fcollection-list-section-settings.gif?alt=media&#x26;token=88c253eb-6823-47ae-8ff0-14133b7bed7a" alt=""><figcaption></figcaption></figure>

### Section settings

<table><thead><tr><th width="252.001708984375">Settings</th><th width="176.634521484375" align="center">Type</th><th>Description</th></tr></thead><tbody><tr><td>Heading</td><td align="center"><code>text</code></td><td>Section title shown above the collection list.</td></tr><tr><td>Heading size</td><td align="center"><code>range</code></td><td>Adjusts the font size of the section heading.</td></tr><tr><td><strong>Layout</strong></td><td align="center"></td><td></td></tr><tr><td>Layout</td><td align="center"><code>select</code></td><td>Choose between <code>Grid</code> or <code>Carousel</code> for desktop view.</td></tr><tr><td>Alignment</td><td align="center"><code>select</code></td><td>Aligns the heading <code>Left</code> or <code>Center</code>.</td></tr><tr><td>Collections per row on desktop</td><td align="center"><code>range</code></td><td>Sets how many collections appear in a row on desktop devices.</td></tr><tr><td>Collections per row on mobile</td><td align="center"><code>select</code></td><td>Sets how many collections display per row on smaller screens: <code>1</code> or <code>2</code>.</td></tr><tr><td>Image shape</td><td align="center"><code>select</code></td><td>Choose between <code>Circles</code> or <code>Squares</code> images. </td></tr><tr><td>Image aspect ratio</td><td align="center"><code>range</code></td><td>Adjusts the height-to-width ratio of the collection image display.</td></tr><tr><td><strong>Collections</strong></td><td align="center"></td><td></td></tr><tr><td>Enable product count</td><td align="center"><code>checkbox</code></td><td>Displays how many products are in each collection.</td></tr><tr><td>Text size</td><td align="center"><code>range</code></td><td>Adjusts the font size for collection titles.</td></tr><tr><td>Overlay text</td><td align="center"><code>checkbox</code></td><td>Enables text to overlay directly on top of collection images.</td></tr><tr><td><strong>Mobile layout</strong></td><td align="center"></td><td></td></tr><tr><td>Enable slider</td><td align="center"><code>checkbox</code></td><td>Converts mobile layout to a horizontal slider.</td></tr><tr><td><strong>Colors</strong></td><td align="center"></td><td></td></tr><tr><td>Color scheme</td><td align="center"><code>color_scheme</code></td><td>Applies a predefined theme color scheme to the section.</td></tr><tr><td>Text</td><td align="center"><code>color</code></td><td>Sets the text color for the section.</td></tr><tr><td><strong>Section spacing</strong></td><td align="center"></td><td></td></tr><tr><td>Width</td><td align="center"><code>select</code></td><td>Choose between <code>Full width padded</code> or <code>Page width</code> content area.</td></tr><tr><td>Padding top and bottom</td><td align="center"><code>range</code></td><td>Adds vertical spacing above and below the section.</td></tr></tbody></table>
