Slideshow

Create a responsive, customizable carousel to showcase banners with engaging layout, animation, and navigation across all devices.

Last updated About 1 month ago

Overview

The Slideshow section creates an interactive, responsive carousel to highlight featured banners. It ensures every slide looks great across all devices, combining flexible layout, animation, and navigation options for an engaging, branded experience.

Slideshow animation and navigation

These options define how users move through your slides — from transitions and timing to autoplay behavior and navigation controls.

  1. Animation style
    Choose the transition between slides:

    • default — horizontal slide (adds movement)

    • fade — smooth crossfade
      Default: default

  2. Animation speed
    Set how quickly slides transition.
    Range: 0.1–5 s Default: 0.8 s

  3. Autoplay delay
    Define the interval between automatic slide changes (in seconds).
    Set 0 to disable autoplay.
    Range: 0–10 s Default: 4 s

  4. Autoplay slideshow
    Enable to automatically rotate slides.
    Default: Disabled

  5. Loop slides
    Restart from the first slide after the last one for continuous playback.
    Default: Disabled

  6. Pagination style
    Select the visual indicator for slide progress:

    • Dynamic

    • Fraction (e.g., 1/5)

    • Progress bar

    • Scrollbar

  7. Show navigation
    Display next and previous arrows for manual browsing.
    Default: Enabled

  8. Show pagination
    Add dots, bars, or numbers to show the current slide position.

📝 Note: Match animation and navigation to your brand personality. Fast transitions and progress bars suit energetic brands; fade effects and fraction indicators complement elegant, editorial styles.

Usage notes

  1. Keep navigation and pagination visible when autoplay is enabled for full user control.

  2. Match transition styles to your brand tone — energetic vs. refined.

  3. Always include descriptive alt text for accessibility.

  4. Test your slideshow on multiple devices for performance, loading time, and visual clarity.

⚠️ Important: A well-tuned slideshow enhances storytelling, draws attention to key promotions, and improves engagement. Optimize images and videos for speed, maintain accessibility, and ensure text is concise for the best results.