Slideshow
A slideshow of images with text. Slides crossfade, with progress bars and a counter, previous and next buttons, and a pause button whenever it plays on its own. It never plays on its own for customers who reduce motion, and stops while hovered or focused.
This section also has the base settings every section shares: color scheme, layout, running head, page number, padding, divider and reveal on scroll.
Settings
| Setting | What it does |
|---|---|
| Height | Options: Adapt to first image, Small, Medium, Full screen. Default: medium. |
| Height on mobile | Options: Same as desktop, Adapt to image, Small, Medium, Full screen. Default: same. |
| Transition | Options: Fade, Slide. Default: fade. |
| Play slides automatically | Customers can pause it. It never plays on its own for customers who reduce motion. Default: on. |
| Time per slide | From 3 to 10 s. Default: 6. |
| Controls | Options: Progress bars and counter, Counter, Dots, Arrows only. Default: progress. |
| Padding on mobile | Options: Same as desktop, Smaller, None. Default: same. |
| Visibility | Options: Show on all devices, Hide on mobile, Hide on desktop. Default: all. |
Blocks
Slide
One slide: an image (with an optional mobile image), an overlay, and any theme blocks for the copy. Position and color scheme are per slide.
| Setting | What it does |
|---|---|
| Image | |
| Mobile image | Optional. Shown on screens narrower than 750px. |
| Video | Plays muted on a loop behind the copy, on the visible slide only. Not played for visitors who reduce motion; the image shows instead. |
| Text position | Options: Top start, Top center, Top end, Middle start, Middle center, Middle end, Bottom start, Bottom center, Bottom end. Default: bottom-start. |
| Content position on mobile | Options: Same as desktop, Top start, Top center, Top end, Middle start, Middle center, Middle end, Bottom start, Bottom center, Bottom end. Default: same. |
| Text alignment | Options: Follow the position, Start, Center, End. Default: auto. |
| Text panel behind content | Options: None, Solid, Frosted. Default: none. |
| Slide link | Makes the whole slide a link. Buttons in the slide keep their own links. |
| Link name for screen readers | Say where the link goes, for example "Shop the summer collection". |
| Overlay color | Default: #000000. |
| Image overlay opacity | From 0 to 80 %. Default: 30. |
| Color scheme | Colors for the text and buttons on this slide. Check contrast against the image and overlay. Default: scheme-2. |