“How do I configure a slideshow?”

A slideshow section takes up to nine slides. Each slide has its own display settings, including custom text alignment, optional text and call to action buttons. If you want, you can set up multiple slideshow sections.

Enable zoom animation
Adds a zooming effect when the customer scrolls up or down. (This is also called parallax scrolling.)
Show progress bar
Displays a progress bar, indicating when one slide will be transitioning to the next slide. See an example
Show dropshadow
Adds a shadow effect to your slideshow text and buttons.
Overlay color
Sets a color that sits on top of your slide. We recommend using this to soften your slide colors so that the text on top can be read easily.
Progress bar color
Sets the color of the progress bar at the bottom of each slide.
Text color
Controls the color of the text on each slide.

Progress bar

The progress bar appears at the foot of the slideshow section. It indicates how long it will take until a slide transitions to the next one.

Progress bar

Slides

You can add up to nine slides per slideshow using the Add slide button. Each slide has a number of settings.

Slide image
An upload form that takes a slideshow image.
Width Height
1440 pixels* 960 pixels*

* Minimum recommended dimensions. This is the size of a modern laptop screen. If you can upload a larger landscape-oriented image, you should do so.

Text alignment
Aligns the slide’s text vertically. You can choose Bottom, Middle or Top.
Heading text
The heading text. This is the most dominant text on the slide.
Subheading text
The subheading text. This is typically used as description.
Button text
The button text.
Link
Set a link to a page of your choice. This is generally another page in your store.

Here’s an example of a slide configured with Bottom text alignment, a heading, a subheading and a button.

Slideshow with all features enabled

You can see the live version of this on the Street demo.

How are my slide images cropped?

Because slides are intended to be full-screen “hero” images, Ira landscape-oriented images expects landscape-oriented images that can fill an entire wide-screen computer monitor.

If you upload an image with a 2:3 aspect ratio (portrait) or a 1:1 aspect ratio (square), the top and bottom parts of the image might be cropped out of the picture. For the best results, an image with a 3:2 aspect ratio (landscape) should be used.

In the diagram below, you can see how much of your 2:3 and 1:1 images would be cropped out of your slideshow:

Slideshow image crop chart

Notice that the landscape-oriented image on the right is barely cropped at all.

On mobile devices, the slideshow is resized to a full-width block. Any heading, subheading, and buttons are repositioned underneath the running slides.