Collection list slider
Section overview
The Collection Slider section displays a horizontally scrollable carousel of collection cards, allowing merchants to showcase multiple collections in an engaging and space-efficient manner.
Common Use Cases
Highlighting different product categories on the homepage
Featuring seasonal or trending collections in a visually appealing way
Creating a browsable overview of your store's catalog
Combining collection cards with custom content blocks for promotional messaging
Usage Tips
Select collections with visually consistent featured images for the most polished appearance
Adjust card width settings to control how many collections appear on screen at once
Consider enabling the split layout option for larger screens to keep heading content visible while scrolling
Use content blocks strategically to add promotional messaging or calls-to-action between collections
For mobile optimization, set card width mobile to 10/12 or 12/12 to ensure collections are properly visible
Section Settings
Collection
Select which collections to display in the slider
Heading
Add a title for the slider section
Content
Add descriptive text that appears above the slider
Button label
Text for the optional button below the heading
Button url
URL for the optional button
Top spacing
Amount of space above the section (0-300px)
Bottom spacing
Amount of space below the section (0-300px)
Color scheme
Background color theme for the section
Custom color
Custom background color (when "Custom" is selected for color scheme)
Text color
Control whether text appears in light or dark mode
Border color
Set the color of section borders
Button color
Style for the button below heading content
Enable color fade
Makes the section influence the page background color as user scrolls
Border position
Where borders appear around the section
Card width mobile
Width of each card on mobile devices (1-12/12 grid)
Card width desktop
Width of each card on desktop devices (1-12/12 grid)
X alignment
Horizontal alignment of section heading content
Arrow alignment
Horizontal alignment of slider navigation arrows
Arrow placement
Vertical position of slider navigation arrows
Enable margin
Add horizontal margins to the section
Enable scroll margin
Add margins to the scrollable area
Enable split
Display heading and content next to the slider instead of above it
Enable split heading
Split the heading into multiple lines
Visibility
Control which device types the section appears on
Auto scroll delay
Time between automatic slide transitions (0 to disable)
Enable arrows
Show navigation arrows for the slider
Enable indicators
Show indicator dots for slider position
Enable scrollbar
Show scrollbar for the slider
Block Settings
Content Block
The Content block allows you to add custom text, images, or videos between collection cards in the slider. Limited to 20 blocks per section.
Heading
Title text for the content block
Content
Rich text content for the block
Button label
Text for the optional button
Url
URL for the button link
Image
Upload an image to display in the block
Show image as background
Display the image as a background behind content
Video
Upload or link a video to display
Enable autoplay
Automatically play video when visible
Enable mute toggle
Show mute button on videos
Enable loop
Continuously loop video playback
Minimum height
Set minimum height for the content block
Enable padding
Add interior padding to the content block
Color scheme
Background color theme for the block
Border color
Set the border style for the block
Text color
Control whether text appears in light or dark mode
Button color
Style for the block's button
Enable gradient
Add a gradient overlay to the block background
Text position
Place text above or below the image/video
Y alignment
Vertical alignment of content within the block
X alignment
Horizontal alignment of content within the block
Last updated
Was this helpful?