How to add a collection slider to any Shopify theme
Share
Introduction
Highlight your collections in a more engaging way with the Flexi Collection Slider — a dynamic, scrollable section designed to showcase product collections visually. Instead of relying on static links or menus, the Collection Slider lets customers browse featured collections directly on the page.
In the video above, you’ll learn how to add a collection slider to any Shopify theme using Flexi’s intuitive block system. You’ll see how to select collections, control slider behavior, and create a mobile-friendly experience that encourages exploration.
Ideal for homepages, collection landing pages, and promotional layouts, the Flexi Collection Slider integrates seamlessly with any Shopify theme. Whether you’re promoting seasonal collections, bestsellers, or curated product groups, this section helps guide shoppers to the right content faster.
Setup Instructions
Install the App
Visit the Shopify App Store and install Flexi Slider Sections. Start your free trial to unlock access to all Flexi sections, including the Collection Slider.
Install Section
Open the Flexi app and navigate to the sections library. Search for "Collection Slider" and click "Add to Theme" to install it instantly.
Add to Your Store
Go to your Shopify admin → Online Store → Themes → Customize. Click "Add section" and select "Collection Slider" from the available sections.
Set Section Width
In the section settings, choose your preferred layout:
- Full width: Spans the entire page width
- Fixed width: Set a custom maximum width (320px – 1440px)
- Theme width: Use your theme’s default container width
Add Content
Click "Add block" to add collection slides. Each slide can link to a collection and display a featured image, title, and optional description.
You can feature top-level categories, seasonal collections, or curated product groupings and reorder them easily using Shopify’s drag-and-drop editor.
Customize & Style
Fine-tune your collection slider using Flexi’s built-in settings:
- Control slides per view on desktop and mobile
- Enable or disable arrows, pagination, and auto-play
- Adjust image ratios, spacing, and alignment
- Customize typography and colors to match your brand
Works Seamlessly with Dawn & Horizon
Flexi sections are built for Shopify’s modern theme architecture, which means the Collection Slider works seamlessly with Dawn, Horizon, and all Online Store 2.0 themes.
Dawn Compatibility
Dawn is Shopify’s reference theme, and the Flexi Collection Slider follows the same responsive layout patterns and spacing conventions used throughout Dawn.
This allows the slider to inherit your theme’s typography, buttons, and grid behavior by default, while still giving you full control over layout and presentation.
Horizon & Modern Framework Support
Horizon represents Shopify’s next-generation theme framework. The Collection Slider integrates cleanly with Horizon-based themes without overriding global styles or introducing JavaScript conflicts.
Each Flexi section is self-contained and theme-safe, making it ideal for modern and highly customized storefronts.
Theme-Safe by Design
Every Flexi section is scoped, isolated, and performance-optimized. This means you can:
- Add or remove the Collection Slider without touching theme code
- Preview changes safely before publishing
- Reuse the same section across multiple themes
- Switch themes without rebuilding your collection navigation
Whether you're using Dawn, Horizon, or a fully custom Online Store 2.0 theme, the Flexi Collection Slider adapts automatically — helping customers discover collections faster and improving overall store navigation.