# Product slider

### Section overview

The Product slider section displays a customizable horizontal slider of products from a selected collection, optionally mixed with content blocks.

#### Common Use Cases

* Showcasing featured products on the homepage
* Highlighting new arrivals or seasonal collections
* Creating a "You may also like" section on product pages
* Building promotional sections that combine content and product cards

#### Usage Tips

* Select a collection with sufficient products to create a meaningful slider
* Consider mobile users by adjusting the card width settings appropriately
* Use content blocks strategically to introduce or explain the product collection
* For best visual results, use images of consistent dimensions throughout the collection

### Section Settings

| Setting            | Description                                                     |
| ------------------ | --------------------------------------------------------------- |
| Collection         | Select the collection to display products from                  |
| Total items        | Maximum number of products to display                           |
| Heading            | Main heading for the section                                    |
| Content            | Descriptive text for the section                                |
| Button label       | Text for the optional button                                    |
| Button url         | URL the 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 and text color combination for the section           |
| Color border       | Color style for section borders                                 |
| Color button       | Style and color for the section button                          |
| Border position    | Position of borders around the section                          |
| Size               | Width of the section content                                    |
| X alignment        | Horizontal alignment of section content                         |
| Arrow alignment    | Horizontal alignment of slider navigation arrows                |
| Card width mobile  | Width of product cards on mobile devices (as a fraction of 12)  |
| Card width desktop | Width of product cards on desktop devices (as a fraction of 12) |
| Enable margin      | Apply horizontal margin to the section                          |
| Enable split       | Split section into a sidebar (1/3) and content area (2/3)       |
| Visibility         | Control whether section appears on mobile, desktop, or both     |
| Enable arrows      | Show navigation arrows for the slider                           |
| Enable indicators  | Show position indicator dots for the slider                     |
| Enable scrollbar   | Show scrollbar for the slider                                   |

### Block Settings

#### Content Block

The Content block adds text, media, and button elements to the product slider. This can be used to introduce or complement the product collection.

Limit: 1 block

| Setting               | Description                                         |
| --------------------- | --------------------------------------------------- |
| Heading               | Block heading text                                  |
| Content               | Descriptive text for the block                      |
| Button label          | Text for the block's button                         |
| Button url            | URL the button links to                             |
| Image                 | Primary image to display                            |
| Image background      | Background image to display behind content          |
| Video                 | Video to display                                    |
| Enable video autoplay | Automatically play video when visible               |
| Enable mute button    | Show a button to toggle video sound                 |
| Enable video loop     | Continuously loop the video                         |
| Minimum height        | Minimum height for the block (in pixels)            |
| Enable padding        | Apply padding around block content                  |
| Color scheme          | Background and text color combination for the block |
| Color text            | Override text color setting                         |
| Color border          | Border color style for the block                    |
| Color button          | Style and color for the block button                |
| Enable gradient       | Apply a gradient effect to the background           |
| Y alignment           | Vertical alignment of content within the block      |
| X alignment           | Horizontal alignment of content within the block    |
| Text position         | Position text above or below the media              |


---

# 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/keystone/sections/products-and-collections/product-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.
