Skip to content

Slideshow

What This Section Does

Creates an eye-catching slideshow banner that rotates through multiple slides, each with its own background image, headline, description, and call-to-action button. Perfect for showcasing multiple promotions, products, or key messages in your most prominent page position.

Perfect for: Homepage hero sections, promotional campaigns, product launches, seasonal sales announcements, or any time you need to highlight multiple important messages in one prominent space.

How to Add It

Step 1: Add the Section

  1. In your Shopify admin, go to Online StoreThemes
  2. Click Customize next to your live theme
  3. Click Add section at the top of your page (usually as the first section)
  4. Choose Slideshow from the list

Step 2: Create Your Slides

  1. Click Add slide to create your first slide
  2. Add a background image, heading, description, and button
  3. Repeat to add more slides (3-5 slides work best)
  4. Configure autoplay and timing settings

Key Settings to Configure

Slide Content

Background Images: High-quality, visually striking images that support your message

  • When to use: Images should be at least 1920px wide for crisp display on all devices
  • Pro tip: Ensure text remains readable over your images by using overlay effects or choosing images with clear text areas

Animation Settings

Auto Rotate: Automatically advance through slides without user interaction

  • Best practice: Enable for promotional content, disable if slides contain important information that needs reading time
  • Timing: 6-8 seconds per slide gives visitors enough time to read and react

Slide Transitions

Animate Slides: Smooth transitions between slides with visual effects

  • When to use: Creates professional, polished presentation
  • Consider: Disable if you prefer instant transitions or have performance concerns

Pro Tips for Success

Best Practices

  • Keep slide count to 3-5 slides maximum - too many can overwhelm visitors
  • Use consistent button text like "Shop Now" or "Learn More" across slides
  • Ensure strong contrast between text and background images for readability
  • Make your first slide the most important - many visitors won't see beyond it
  • Use high-quality images that align with your brand aesthetic

Common Mistakes

  • Don't use too many slides - visitors often only see the first one
  • Avoid auto-rotating too quickly - visitors need time to read and click
  • Don't use low-resolution images - they'll look blurry on high-resolution screens
  • Avoid putting critical information only in later slides
  • Don't make text too small - mobile visitors need to read it easily