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

Setting	Description
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.

Setting	Description
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