# Collection list slider

### Section overview

The Collection Slider section displays a horizontally scrollable carousel of collection cards, allowing merchants to showcase multiple collections in an engaging and space-efficient manner.

#### Common Use Cases

* Highlighting different product categories on the homepage
* Featuring seasonal or trending collections in a visually appealing way
* Creating a browsable overview of your store's catalog
* Combining collection cards with custom content blocks for promotional messaging

#### Usage Tips

* Select collections with visually consistent featured images for the most polished appearance
* Adjust card width settings to control how many collections appear on screen at once
* Consider enabling the split layout option for larger screens to keep heading content visible while scrolling
* Use content blocks strategically to add promotional messaging or calls-to-action between collections
* For mobile optimization, set card width mobile to 10/12 or 12/12 to ensure collections are properly visible

### Section Settings

| Setting              | Description                                                           |
| -------------------- | --------------------------------------------------------------------- |
| Collection           | Select which collections to display in the slider                     |
| Heading              | Add a title for the slider section                                    |
| Content              | Add descriptive text that appears above the slider                    |
| Button label         | Text for the optional button below the heading                        |
| Button url           | URL for the optional button                                           |
| Top spacing          | Amount of space above the section (0-300px)                           |
| Bottom spacing       | Amount of space below the section (0-300px)                           |
| Color scheme         | Background color theme for the section                                |
| Custom color         | Custom background color (when "Custom" is selected for color scheme)  |
| Text color           | Control whether text appears in light or dark mode                    |
| Border color         | Set the color of section borders                                      |
| Button color         | Style for the button below heading content                            |
| Enable color fade    | Makes the section influence the page background color as user scrolls |
| Border position      | Where borders appear around the section                               |
| Card width mobile    | Width of each card on mobile devices (1-12/12 grid)                   |
| Card width desktop   | Width of each card on desktop devices (1-12/12 grid)                  |
| X alignment          | Horizontal alignment of section heading content                       |
| Arrow alignment      | Horizontal alignment of slider navigation arrows                      |
| Arrow placement      | Vertical position of slider navigation arrows                         |
| Enable margin        | Add horizontal margins to the section                                 |
| Enable scroll margin | Add margins to the scrollable area                                    |
| Enable split         | Display heading and content next to the slider instead of above it    |
| Enable split heading | Split the heading into multiple lines                                 |
| Visibility           | Control which device types the section appears on                     |
| Auto scroll delay    | Time between automatic slide transitions (0 to disable)               |
| Enable arrows        | Show navigation arrows for the slider                                 |
| Enable indicators    | Show indicator dots for slider position                               |
| Enable scrollbar     | Show scrollbar for the slider                                         |

### Block Settings

#### Content Block

The Content block allows you to add custom text, images, or videos between collection cards in the slider. Limited to 20 blocks per section.

| Setting                  | Description                                        |
| ------------------------ | -------------------------------------------------- |
| Heading                  | Title text for the content block                   |
| Content                  | Rich text content for the block                    |
| Button label             | Text for the optional button                       |
| Url                      | URL for the button link                            |
| Image                    | Upload an image to display in the block            |
| Show image as background | Display the image as a background behind content   |
| Video                    | Upload or link a video to display                  |
| Enable autoplay          | Automatically play video when visible              |
| Enable mute toggle       | Show mute button on videos                         |
| Enable loop              | Continuously loop video playback                   |
| Minimum height           | Set minimum height for the content block           |
| Enable padding           | Add interior padding to the content block          |
| Color scheme             | Background color theme for the block               |
| Border color             | Set the border style for the block                 |
| Text color               | Control whether text appears in light or dark mode |
| Button color             | Style for the block's button                       |
| Enable gradient          | Add a gradient overlay to the block background     |
| Text position            | Place text above or below the image/video          |
| Y alignment              | Vertical alignment of content within the block     |
| X alignment              | Horizontal alignment of content within the block   |


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.brickspacelab.com/space/sections/products-and-collections/collection-list-slider.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
