Electro How to Use Electro Slideshow

Theme: Electro · Section type: All-template section

A Slideshow shows up to 5 full-width slides, each with its own image, text, and 2 buttons. Use it at the top of your homepage to promote several collections or campaigns in the same space.

Note: You can add this section to any template, but not to the header or footer. Each section holds up to 5 slides.

What you can do

• Add the section and your slides
• Add text and buttons to a slide
• Change the slideshow controls and autoplay
• Set the slide height and content position
• See what customers see
• Look up every setting
• Fix common problems

Add the section and your slides

1. In the theme editor, open the template where you want the section.
2. In the left sidebar, click Add section > Slideshow. The section comes with 3 slides.
3. Click a Slide block. Under Image, select a Background image.
4. Optional: select a Mobile background image (optional). If you don't add one, mobile shows the background image.
5. To add a slide, click Add block > Slide. To change the order, drag the slides in the sidebar.
6. Click Save.

Tip: Use images with the same ratio for all slides, so the slideshow doesn't change height between slides. About 2880 x 1200 px is recommended for large screens and 750 x 1400 px for mobile.

Add text and buttons to a slide

1. Click a Slide block.
2. Under Text, enter a Subheading, a Heading, and a Description.
3. Under Buttons, enter a Button 1 label, choose a Button 1 style, and add a Button 1 link. Do the same for Button 2, or leave its label empty to hide it.
4. Under General, choose a Content position on large screen and a Content position on mobile.
5. Optional: adjust Overlay opacity so the text is easy to read.
6. Click Save.

Note: The heading size is set for the whole slideshow. Click the Slideshow section and change Heading size under General.

Change the slideshow controls and autoplay

1. Click the Slideshow section.
2. Under Controller, choose a Style and a Position.
3. Turn Show pagination and Show navigation on or off.
4. Turn on Enable autoplay and set Change slides every to how long each slide stays on screen.
5. Click Save.

Set the slide height and content position

1. Click the Slideshow section.
2. Under Layout, choose a Section height on large screen and a Section height on mobile.
3. Click Save.

Tip: Choose Adapt to image to show each image without cropping. If a slide's text needs more room than the height you choose, the slideshow grows to fit it.

What customers see

• Large screens: one slide at a time, with its text and buttons at the content position you chose. The controls sit at the bottom of the slideshow.
• Changing slides: customers click the arrows or a dot or bar. With autoplay on, slides change on their own, and customers can stop and restart them with the pause/play button.
• Mobile: each slide shows its mobile image, or the main image if you didn't add one. Customers can also swipe between slides.
• Buttons: clicking a button opens its link.

Settings reference

General

Layout

Controller

Accessibility

Slide settings

Troubleshooting

I can't add another slide.
A Slideshow holds up to 5 slides. Remove a slide, or add a second Slideshow section.

The slides don't change on their own.
Turn on Enable autoplay under Controller. Customers can also pause autoplay with the pause/play button.

The slideshow jumps in height between slides.
With Adapt to image, each slide takes the ratio of its own image. Use images with the same ratio for all slides, or choose a fixed height such as 70% screen height.

I can't change the heading size on one slide.
Heading size is a section setting and applies to all slides. Click the Slideshow section and change it under General.

Related articles

• Electro Image banner
• Electro Moving image banner
• Electro Video banner
• Electro Theme settings

Updated on: 30/10/2026