Slideshow is a Shopify theme block in the Section Star library. Add n slideshow to any section that supports Theme Blocks.
Live demo
Settings
Every setting below appears in the Shopify theme customizer once the block is published.
Caption Design
Set the fonts and colors for your caption
| Setting | Type | Default |
|---|---|---|
| Text Size | Range | 15 |
| Text Color | Color | #111 |
| Caption Background Color | Color or gradient | linear-gradient(177deg, rgba(255, 255… |
Slideshow Design
Set the design of your slideshow
| Setting | Type | Default |
|---|---|---|
| Progress Background Color | Color or gradient | linear-gradient(177deg, rgba(17, 17, … |
| Progress Foreground Color | Color or gradient | linear-gradient(177deg, rgba(17, 17, … |
| Indicator Color | Color | #111 |
| Media Aspect Ratio | Select (21:9, 16:9, 4:3, 1:1) | 4 / 3 |
| Enable Slideshow Autoplay? | Checkbox | On |
| Slideshow Autoplay Time | Select (Slowest (10s), Slower (7.5s), Normal (5s), Faster (3s), Fastest (2s)) | 5000 |
Slideshow Items
Choose the images and captions for your slideshow
| Setting | Type | Default |
|---|---|---|
| Image 1 | Image | — |
| Caption | Inline rich text | Use this field to caption your slide |
| Image 2 | Image | — |
| Caption 2 | Inline rich text | Use this field to caption your slide |
| Image 3 | Image | — |
| Caption 3 | Inline rich text | Use this field to caption your slide |
| Image 4 | Image | — |
| Caption 4 | Inline rich text | Use this field to caption your slide |
| Image 5 | Image | — |
| Caption 5 | Inline rich text | Use this field to caption your slide |
| Image 6 | Image | — |
| Caption 6 | Inline rich text | Use this field to caption your slide |
| Image 7 | Image | — |
| Caption 7 | Inline rich text | Use this field to caption your slide |
| Image 8 | Image | — |
| Caption 8 | Inline rich text | Use this field to caption your slide |
| Image 9 | Image | — |
| Caption 9 | Inline rich text | Use this field to caption your slide |
| Image 10 | Image | — |
| Caption 10 | Inline rich text | Use this field to caption your slide |
| Desktop CSS | Liquid | — |
| Mobile CSS | Liquid | — |
How to add this block to a Shopify store
- Install Section Star from the Shopify App Store.
- Open the app and find “Slideshow” in the blocks library.
- Publish it to the theme you want to use it in.
- In the Shopify theme customizer, add the block inside a compatible section.
- Configure it with the settings listed above.