Slideshow
sections/slideshow.liquid
Settings
| Setting | ID | Type | Default | Notes |
|---|---|---|---|---|
| Layout | ||||
| Image height | image_height | Dropdown | fixed | Options: Height of first image, Fixed height, Full screen height. |
| Minimum fixed height on large screens | min_height_desktop | Slider | 480 | Range: 300–900 step 20. |
| Minimum fixed height on mobile | min_height_mobile | Slider | 420 | Range: 240–700 step 20. |
| Slideshow appearance | ||||
| Pagination style | pagination_style | Dropdown | arrows | Options: Arrows, Dots. |
| Pagination color | pagination_color | Color | #FFFFFF | |
| Pagination position | pagination_position | Dropdown | center | Options: Left, Center, Right. |
| Slide transition | slide_transition | Dropdown | slide-fade | Options: Fade, Slide and fade. |
| Auto-rotate slides | autoplay | On/off | Off | |
| Change slides every | autoplay_interval | Slider | 6 | Range: 3–12 step 1. |
| Style | ||||
| Image tint color | tint_color | Color | #000000 | |
| Image tint opacity | tint_opacity | Slider | 0 | Range: 0–80 step 5. |
| Make section background full width | full_width | On/off | On | |
| Accessibility / SEO | ||||
| Slideshow description | slideshow_description | Text | Describe the slideshow for customers using screen readers. | |
| Load the section without animation | disable_animation | On/off | Off | If this section is visible when the page loads, enabling this setting can reduce CLS and may improve site speed scores. |
Blocks
Slide (slide)
| Setting | ID | Type | Default | Notes |
|---|---|---|---|---|
| Image | image | Image | For best results, use a landscape shaped image with a minimum width of 3200px. | |
| Background video (optional) | video | Video (Shopify-hosted) | Plays muted and looping behind the text, overriding the image. Set the image above as the poster/fallback. | |
| Mobile image (optional) | mobile_image | Image | For best results, use a square or portrait shaped image. If no mobile image is provided, the large screen image will be used. | |
| Image link (optional) | image_link | Link | ||
| Text overlay | ||||
| Text position | text_position | Dropdown | middle-left | Options: Top left, Top center, Top right, Middle left, Middle center, Middle right, Bottom left, Bottom center, Bottom right. |
| Text alignment | text_alignment | Dropdown | left | Options: Left, Center, Right. |
| Center text on mobile | center_text_mobile | On/off | On | |
| Content width | content_width | Dropdown | medium | Options: Narrow, Medium, Wide. |
| Text background | text_background | Dropdown | none | Adds a backdrop behind the text for legibility over busy images. Options: None, Solid, Gradient. |
| Subheading | subheading | Text | New season | Shown above the main heading. |
| Heading | heading | Text | Timeless pieces, made to last | Enter <br> for a line-break. |
| Heading size | heading_size | Dropdown | extra-large | Options: Small, Medium, Large, Extra extra large. |
| Set as page heading (uses h1 tag) | heading_as_h1 | On/off | Off | For optimum SEO, a page should only have one h1 and it should be the first heading on the page. |
| Text | text | Rich text | <p>Thoughtfully made and built to last. Edit this slide to tell your store's story.</p> | |
| Enlarge text | enlarge_text | On/off | On | |
| Buttons | ||||
| Button 1 label | button_1_label | Text | Shop now | |
| Button 1 link | button_1_link | Link | ||
| Button 1 style | button_1_style | Dropdown | primary | Options: Primary button, Secondary button, Text link. |
| Button 2 label | button_2_label | Text | Learn more | |
| Button 2 link | button_2_link | Link | ||
| Button 2 style | button_2_style | Dropdown | secondary | Options: Primary button, Secondary button, Text link. |
| Text color | ||||
| Text color | text_color | Color | #FFFFFF | Text shows over the image, so pick a color with strong contrast. |
Maximum blocks: 5
Presets
Available in Add section: Slideshow