Slideshow Section
This guide describes setting up the Slideshow section.
Use this section to create an image slideshow with customizable slides that can include text overlays, call-to-action buttons, and mobile-specific images. The slideshow supports both fullscreen and fixed-height modes with various animation options.
For general guidance with modifying sections, refer to [Sections overview], and [Shopify help: Sections and blocks].
Main Settings
| Setting name | Description |
|---|---|
| Autoplay slides | Choose from Disabled, 2s, 4s, 8s, or 16s intervals. Default is 4s |
| Slide height | Choose between "Full screen" or "Fixed height". Default is fullscreen |
| Desktop/Mobile fixed height | Set specific heights (200-1000px) when using fixed height mode |
| Slide animation | Choose between Slide, Fade, or Instant transitions |
| Navigation | Toggle arrows and dots navigation independently |
| Section padding | Adjust top and bottom padding (0-100px). Default is 0px |
| Color scheme | Select color scheme to match your design. Default is scheme-1 |
Slide Block Settings
Each slide can be configured with:
| Setting name | Description |
|---|---|
| Image | Desktop image (1800 x 800px recommended) |
| Mobile image | Optional mobile-specific image (800 x 1200px recommended) |
| Image focal point | Choose image anchor point (Top, Center, Bottom) |
| Content position | Position overlay content in 9 different positions |
| Content width | Choose from One third to Full width for desktop |
| Heading/Text | Add title and description with customizable sizes |
| CTA | Add button or link with custom text and styling |
| Alternative colors | Toggle alternative colors for header items and text |
Note: The section comes preset with three slides showcasing different CTA examples ("Learn More", "Shop Now", "Contact Us"). You can add or remove slides as needed.