Slideshow
A rotating carousel of hero-style slides. Use when you have 2–4 equally important messages to show at the top of your homepage — new arrivals + a promo + a brand story, for example.
Add a slideshow
Add section → Slideshow
Add slides
Click Add block → Slide for each slide you want.
For each slide
Fill in:
- Image — the slide background
- Heading — main text
- Subheading — optional supporting line
- Button label + link — one CTA per slide
Save
Autoplay
Click the Slideshow section
Find Autoplay
Options:
- Off — shoppers manually swipe or click arrows
- On — slides rotate automatically every N seconds
If autoplay is on, set the Rotation interval (5 seconds is typical).
Reduced motion. Shoppers with “reduce motion” enabled at the OS level see slides statically — the autoplay stops automatically. This is an accessibility best practice.
Dots and arrows
Same panel, find Navigation
Options:
- Dots only — small dots below the slideshow
- Arrows only — left/right chevrons on the sides
- Both
- None — no manual navigation, autoplay-only (not recommended)
Slide height
Same panel, find Height
Options:
- Adapt to first image — matches the natural height of your first slide
- Small (350–400px)
- Medium (500–600px)
- Large (700–800px)
- Full viewport — takes the full browser height
Bigger heights feel more premium but push everything else below the fold.
Text overlay position
Per slide, choose where the text sits over the image:
- Center (default)
- Top-left, top-center, top-right
- Bottom-left, bottom-center, bottom-right
Adjust so the text doesn’t overlap busy parts of each image.