Product slideshow settings
Last updated 4 months ago
Overview
Product slideshow sets the default look and behavior for all product carousels. Use it to keep styling and navigation consistent across your store, and override at the section or block level when a unique presentation is needed.
⚠️ Important: Changes here apply to all product slideshows site-wide unless a section/block explicitly overrides them.
Product slideshow settings
This group manages layout, transitions, speed, autoplay, and navigational cues for every product slideshow by default. It offers separate controls for desktop and mobile, so each experience can be optimized for its environment.
Column count (desktop)
Set how many product slides are visible at once on larger screens. Fine-tune your layout for desktop users with adjustable increments.
Minimum value is 1.
Maximum value is 5.
Steps increase by 0.1.
The default setting is 1.1.
Using a fractional column count, such as 1.1, will display part of the next slide and encourage exploration.
Column count (mobile)
Design a different column layout for mobile users to support easy swiping and larger touch targets.
Minimum value is 1.
Maximum value is 5.
Steps increase by 0.1.
The default setting is 1.1.
Selecting different values for desktop and mobile lets you refine the experience for each context.
Animation style
Choose the transition effect between slides. Animation style impacts the perceived tempo and style of browsing.
Default — Standard sliding transition (default).
Fade — Gently blends slides for a smooth effect.
The fade animation always shows only a single slide, regardless of column count.
Animation speed
Control the duration of slide transitions for a tailored browsing pace.
Minimum value is 0.1 seconds.
Maximum value is 5 seconds.
Steps increase by 0.1 seconds.
The default setting is 0.8 seconds.
Faster speeds create a lively experience, while slower speeds offer a calming effect.
Autoplay delay
Set the amount of time each slide is displayed before advancing when autoplay is enabled.
Minimum value is 0 seconds.
Maximum value is 10 seconds.
Steps increase by 1 second.
The default setting is 4 seconds.
A delay of 0 results in slides advancing as quickly as possible.
Enable autoplay
Turns on automatic slide advancement at the selected delay interval.
Default state is off.
⚠️ Consider how autoplay affects accessibility and user control.
Loop slides
Let slideshows seamlessly restart after the last slide, instead of stopping at the end.
Default state is off.
⚠️ Looping helps keep users engaged for continuous product exploration.
Pagination style
Show users their position within the slideshow with different indicator styles.
Dynamic — Adaptive bullets that respond to the number of slides.
Fraction — Displays slide position numerically (e.g., "2/5").
Progress bar — Visual bar fills as slides progress.
Scrollbar — Draggable bar for direct navigation.
Choose the style that best fits your shop’s branding and usability needs.
Show navigation
Enable or disable arrows or buttons for manual slide control. The default is on.
Navigation supports accessibility and helps users discover more products.
Show pagination
Show or hide pagination cues like dots or numbers. The default is on.
Pagination is especially useful in longer or looping slideshows so users always know their spot.
Usage notes
Changes here act as global defaults; you can still override them elsewhere for unique layouts or promotions.
Desktop and mobile column controls allow you to tailor product visibility and usability for every device.
Enabling autoplay can add movement, but navigation and pagination should stay visible for accessibility.
Adjust animation speed and autoplay delay based on how you want users to feel while browsing.
Clear, well-labeled navigation and pagination improve accessibility and orientation for all customers.
💡 Tip: Consistent Product slideshow settings improve your brand's visual identity and user confidence. Use these as a starting point, but don't hesitate to fine-tune them at the section or block level for special cases or promotions.