Last updated: March 2026 Category: Designing Your App
Overview
The Slideshow component creates a rotating image carousel on your app's home screen. It's one of the most popular components for showcasing promotions, featured collections, or seasonal campaigns. Each slide can have its own image and link, and the slideshow supports auto-play and navigation dots.
How to Use
Adding a Slideshow
In the Template Builder, drag the Slideshow component from the Component Palette into the Phone Preview.
Click on the Slideshow in the preview to select it. The Inspector Panel opens on the right.
[Screenshot: Slideshow component added to the Phone Preview with the Inspector Panel open]
Adding Slides
In the Inspector Panel, go to the Content tab.
Click Add Slide to create a new slide.
For each slide, configure:
Image — Click the image picker to open the Media Library. Upload a new image or select an existing one.
Link — Enter the deep link destination for when a customer taps this slide (e.g., a collection page, product, or external URL).
Repeat for as many slides as you need.
[Screenshot: Content tab showing multiple slides with image thumbnails and link fields]
Reordering Slides
To change the order in which slides appear:
In the Content tab, hover over the slide you want to move.
Grab the drag handle on the left side of the slide row.
Drag the slide up or down to the desired position.
Release to confirm the new order.
Removing a Slide
Click the Delete icon next to any slide to remove it from the slideshow.
Settings
The following options are available in the Settings tab:
Auto-play — Toggle on to have the slideshow advance automatically. When enabled, slides cycle without customer interaction.
Auto-play interval — Set the time in seconds between slide transitions (e.g., 3, 5, or 8 seconds).
Navigation dots — Toggle on to display small indicator dots below the slideshow so customers can see how many slides exist and which one is active.
Loop — When enabled, the slideshow cycles back to the first slide after the last one.
Layout Options
In the Layout tab, you can adjust:
Height — Set the slideshow height in pixels or as a ratio.
Padding — Add spacing around the slideshow.
Border radius — Round the corners of the slideshow container.
Tips
Use high-resolution images that are optimized for mobile screens. Aim for a 16:9 or 2:1 aspect ratio for best results.
Keep the number of slides between 3 and 6. Too many slides means customers may never see the later ones.
Set the auto-play interval to at least 4 seconds so customers have time to read each slide.
Make sure each slide links to a relevant page — every slide is a call to action.
Test your slideshow on the preview to confirm images display correctly and transitions feel smooth.
Related Articles