How to add a section with auto rotating images to any Shopify theme
Share
Introduction
Add motion and visual interest to your storefront with the Flexi Auto-Rotating Images section — a dynamic layout designed to cycle through images automatically and capture attention without overwhelming the page. Auto-rotating image sections are ideal for highlighting promotions, storytelling, or brand visuals in a subtle, engaging way.
In the video above, you’ll learn how to add a section with auto-rotating images to any Shopify theme using Flexi’s intuitive settings. Discover how to control rotation speed, transitions, and layout behavior while ensuring a smooth experience on both desktop and mobile.
Perfect for homepages, landing pages, and brand storytelling sections, the Flexi Auto-Rotating Images section integrates seamlessly with any Shopify theme. Whether you’re showcasing lifestyle imagery or rotating campaign visuals, this section helps bring your content to life.
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 Auto-Rotating Images.
Install Section
Open the Flexi app and navigate to the sections library. Search for "Auto-Rotating Images" 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 "Auto-Rotating Images" from the available sections.
Set Section Width
In the section settings, choose your preferred layout:
- Full width: Create an immersive, edge-to-edge image experience
- Fixed width: Set a custom maximum width (320px – 1440px)
- Theme width: Match your theme’s default content container
Add Content
Click "Add block" to add images to the rotation. Each block represents one image in the sequence and can include optional links or overlay content.
You can reorder images using drag-and-drop and control how often images rotate to create the right balance between motion and readability.
Customize & Style
Fine-tune your auto-rotating image section using Flexi’s built-in settings:
- Adjust rotation speed and transition style
- Enable or disable pause-on-hover
- Control image aspect ratio and alignment
- Customize overlays, typography, and colors
Works Seamlessly with Dawn & Horizon
Flexi sections are built for Shopify’s modern theme architecture, which means the Auto-Rotating Images section works seamlessly with Dawn, Horizon, and all Online Store 2.0 themes.
Dawn Compatibility
Dawn is Shopify’s reference theme, and the Flexi Auto-Rotating Images section follows the same responsive layout patterns, spacing conventions, and accessibility best practices used throughout Dawn.
This ensures your rotating images inherit your theme’s typography, buttons, and spacing by default, while still giving you precise control over timing and presentation.
Horizon & Modern Framework Support
Horizon represents Shopify’s next-generation theme framework. The Auto-Rotating Images section integrates cleanly with Horizon-based themes without overriding global styles or introducing JavaScript conflicts.
Because the section is self-contained and theme-safe, you can confidently use it in modern and highly customized storefronts.
Theme-Safe by Design
Every Flexi section is scoped, isolated, and performance-optimized. This means you can:
- Add or update rotating images without editing theme code
- Preview animation changes safely before publishing
- Reuse the same section across multiple themes
- Switch themes without rebuilding visual content
Whether you're using Dawn, Horizon, or a fully custom Online Store 2.0 theme, Flexi’s Auto-Rotating Images section adapts automatically — helping you add motion and visual interest while maintaining performance and design consistency.