# Slideshow

### Section overview

The slideshow section creates a dynamic slideshow with customizable slides featuring background images or videos with text overlays, buttons, and navigation controls.

#### Common use cases

* Create engaging hero banners on homepage
* Showcase multiple product collections or promotions
* Display announcements or welcome messages with compelling visuals
* Create interactive brand stories or feature highlights

#### Usage tips

* Use high-contrast images that make text easily readable
* Keep slide content concise and action-oriented
* For better performance, optimize images before uploading
* Consider mobile users by testing how slides appear on smaller screens
* Limit the number of slides to 3-5 for optimal user experience
* Adjust auto-scroll settings based on the amount of content in each slide

### Section settings

| Setting              | Description                                                                       |
| -------------------- | --------------------------------------------------------------------------------- |
| Color scheme         | Controls the overall color theme of the slideshow section                         |
| Text color           | Determines the text color, with options for default, forced light, or forced dark |
| Border color         | Sets the color of any borders on the slideshow                                    |
| Enable gradient      | Adds a subtle gradient overlay to slides to improve text readability              |
| Border position      | Positions borders around the slideshow (none, top, bottom, or both)               |
| Vertical spacing     | Controls the height of the slideshow from extra small to extra large              |
| Vertical alignment   | Aligns slide content vertically (top, middle, or bottom)                          |
| Horizontal alignment | Aligns slide content horizontally (left, center, or right)                        |
| Visibility           | Controls visibility on different devices (all, mobile only, or desktop only)      |
| Auto-scroll delay    | Sets the time in seconds before advancing to the next slide                       |
| Enable auto-scroll   | Toggles automatic advancement through slides                                      |

### Block settings

#### Slide

Each slide block creates an individual slide in the slideshow containing background media and content.

| Setting                  | Description                                                                                  |
| ------------------------ | -------------------------------------------------------------------------------------------- |
| Desktop background image | The image displayed on desktop devices                                                       |
| Mobile background image  | An optional separate image optimized for mobile devices                                      |
| Background video         | Video file to be used as slide background                                                    |
| Show entire image        | When enabled, displays the full image (object-contain) instead of cropping it (object-cover) |
| Show video on mobile     | Toggles video visibility on mobile devices                                                   |
| Heading                  | Main headline text for the slide                                                             |
| Content                  | Rich text area for additional content on the slide                                           |
| Primary button color     | Sets the style of the primary call-to-action button                                          |
| Primary button label     | Text displayed on the primary button                                                         |
| Primary button URL       | Destination link for the primary button                                                      |
| Secondary button color   | Sets the style of the secondary call-to-action button                                        |
| Secondary button label   | Text displayed on the secondary button                                                       |
| Secondary button URL     | Destination link for the secondary button                                                    |


---

# 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/paper/sections/content-and-media/slideshow.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.