Slideshow

A full-width hero slider that cycles through multiple slides, each with an image, text overlay, and call-to-action buttons.

Section settings

SettingDescriptionDefault
Section widthBoxed or full widthFull
Desktop image ratioOriginal / Landscape / Portrait / Wide / Tall / Adapt first
Mobile image ratioSame options as desktop
AutoplayAutomatically cycle through slidesOff
Autoplay speedSeconds between slides (3–10s)5s
Show arrowsDisplay navigation arrowsOn
Show paginationDisplay progress indicatorsOn
Show shadowAdd shadow to the slideshow containerOff
Allow transparent headerAllow the header to overlay this sectionOff

Slide block settings

Each slide can be configured independently:

  • Desktop image and Mobile image — separate images for each breakpoint
  • Overlay — toggle and control opacity (0–80%)
  • Subheading, Heading, Text — content fields
  • Heading size — xs, sm, md, lg, xl
  • Content alignment — left, center, right
  • Vertical alignment — top, middle, bottom
  • Two buttons — each with label, link, and style (default / outlined / blur)
  • Color scheme — per-slide color scheme

Tips

  • Use high-quality images (1920px wide recommended for desktop)
  • Upload separate mobile images for better composition on small screens
  • Keep text concise — the slideshow is best for short, impactful messages
  • Use the "Adapt first" image ratio to match the aspect ratio of your first slide's image