# Collection slider

### Section overview

The Collection slider section allows merchants to showcase products from a selected collection in an interactive horizontal slider format with customizable appearance and behavior.

#### Common use cases

* Highlight featured products or bestsellers on the homepage
* Display related products within collection or product pages
* Create seasonal or promotional product showcases
* Combine product recommendations with custom content blocks

#### Usage tips

* Choose appropriate card widths for both mobile and desktop to ensure products are displayed attractively across devices
* Consider enabling split layout for sections with longer headings or descriptions to prevent overcrowding
* Use the auto-scroll feature sparingly to avoid frustrating users who are trying to browse at their own pace
* For mobile, select wider card widths (8/12 or higher) to ensure products are easily viewable on smaller screens

### Section settings

| Setting              | Description                                                                |
| -------------------- | -------------------------------------------------------------------------- |
| Collection           | Select which product collection to display in the slider                   |
| Products count       | Maximum number of products to display                                      |
| Heading              | Main section heading text                                                  |
| Content              | Rich text area for section description                                     |
| Button label         | Text to display on the section button                                      |
| Button url           | URL the section button links to                                            |
| Top spacing          | Amount of padding above the section (in pixels)                            |
| Bottom spacing       | Amount of padding below the section (in pixels)                            |
| Color scheme         | Background color theme for the section                                     |
| Custom color         | Custom background color (when color scheme is set to custom)               |
| Text color           | Force text to display as light or dark, or use default based on background |
| Border color         | Color style for section borders                                            |
| Button color         | Style and color for the section button                                     |
| Enable color fade    | Allow section to change page background color when scrolled into view      |
| Border position      | Position of decorative borders around the section                          |
| Card width mobile    | Width of product cards on mobile devices (in 12ths)                        |
| Card width desktop   | Width of product cards on desktop devices (in 12ths)                       |
| X alignment          | Horizontal alignment of section content                                    |
| Arrow alignment      | Horizontal alignment of slider navigation arrows                           |
| Arrow placement      | Vertical position of slider navigation arrows                              |
| Enable margin        | Add horizontal margin to section                                           |
| Enable scroll margin | Add margin to scrollable area                                              |
| Enable split         | Split section into two columns with heading on left and content on right   |
| Enable split heading | Split the heading across two lines                                         |
| Visibility           | Control which device types the section appears on                          |
| Auto scroll delay    | Time between automatic slide transitions (in seconds)                      |
| Enable arrows        | Show navigation arrows for the slider                                      |
| Enable indicators    | Show indicator dots for slider position                                    |
| Enable scrollbar     | Show scrollbar for slider navigation                                       |

### Block settings

#### Content

The content block allows for adding custom promotional content alongside products in the slider.

* Block limit: 1

| Setting                  | Description                                                                |
| ------------------------ | -------------------------------------------------------------------------- |
| Heading                  | Block heading text                                                         |
| Content                  | Rich text area for block content                                           |
| Button label             | Text to display on the block button                                        |
| Url                      | URL the block button links to                                              |
| Image                    | Image to display in the block                                              |
| Show image as background | Display the selected image as a background instead of inline               |
| Video                    | Video to display in the block                                              |
| Enable autoplay          | Automatically play video when visible                                      |
| Enable mute toggle       | Show button to toggle video sound on/off                                   |
| Enable loop              | Continuously loop video playback                                           |
| Minimum height           | Minimum height of the block (in pixels)                                    |
| Enable padding           | Add padding inside the block                                               |
| Color scheme             | Background color theme for the block                                       |
| Border color             | Color style for block borders                                              |
| Text color               | Force text to display as light or dark, or use default based on background |
| Button color             | Style and color for the block button                                       |
| Enable gradient          | Apply a gradient effect to the block background                            |
| Text position            | Position of text relative to media (above or below)                        |
| Y alignment              | Vertical alignment of block content                                        |
| X alignment              | Horizontal alignment of block content                                      |


---

# 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-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.
