Product slider
Section overview
The Product slider section displays a customizable horizontal slider of products from a selected collection, optionally mixed with content blocks.
Common Use Cases
Showcasing featured products on the homepage
Highlighting new arrivals or seasonal collections
Creating a "You may also like" section on product pages
Building promotional sections that combine content and product cards
Usage Tips
Select a collection with sufficient products to create a meaningful slider
Consider mobile users by adjusting the card width settings appropriately
Use content blocks strategically to introduce or explain the product collection
For best visual results, use images of consistent dimensions throughout the collection
Section Settings
Collection
Select the collection to display products from
Total items
Maximum number of products to display
Heading
Main heading for the section
Content
Descriptive text for the section
Button label
Text for the optional button
Button url
URL the button links to
Top spacing
Amount of padding above the section (in pixels)
Bottom spacing
Amount of padding below the section (in pixels)
Color scheme
Background and text color combination for the section
Color border
Color style for section borders
Color button
Style and color for the section button
Border position
Position of borders around the section
Size
Width of the section content
X alignment
Horizontal alignment of section content
Arrow alignment
Horizontal alignment of slider navigation arrows
Card width mobile
Width of product cards on mobile devices (as a fraction of 12)
Card width desktop
Width of product cards on desktop devices (as a fraction of 12)
Enable margin
Apply horizontal margin to the section
Enable split
Split section into a sidebar (1/3) and content area (2/3)
Visibility
Control whether section appears on mobile, desktop, or both
Enable arrows
Show navigation arrows for the slider
Enable indicators
Show position indicator dots for the slider
Enable scrollbar
Show scrollbar for the slider
Block Settings
Content Block
The Content block adds text, media, and button elements to the product slider. This can be used to introduce or complement the product collection.
Limit: 1 block
Heading
Block heading text
Content
Descriptive text for the block
Button label
Text for the block's button
Button url
URL the button links to
Image
Primary image to display
Image background
Background image to display behind content
Video
Video to display
Enable video autoplay
Automatically play video when visible
Enable mute button
Show a button to toggle video sound
Enable video loop
Continuously loop the video
Minimum height
Minimum height for the block (in pixels)
Enable padding
Apply padding around block content
Color scheme
Background and text color combination for the block
Color text
Override text color setting
Color border
Border color style for the block
Color button
Style and color for the block button
Enable gradient
Apply a gradient effect to the background
Y alignment
Vertical alignment of content within the block
X alignment
Horizontal alignment of content within the block
Text position
Position text above or below the media
Last updated
Was this helpful?