How to add a category columns section to any Shopify theme
Share
Introduction
Improve navigation and product discovery with the Flexi Category Columns section — a clean, structured layout designed to showcase your main product categories in clear, easy-to-scan columns. Instead of relying solely on menus or long collection lists, this section gives customers a visual way to explore your store.
In the video above, you’ll learn how to add a category columns section to any Shopify theme using Flexi’s intuitive section settings. You’ll see how to select collections, control column layouts, and create a responsive design that works beautifully across desktop and mobile.
Ideal for homepages, collection landing pages, or “Shop by Category” sections, the Flexi Category Columns section integrates seamlessly with any Shopify theme. Whether your brand is minimalist or highly visual, you can tailor the layout to match your storefront.
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 Category Columns.
Install Section
Open the Flexi app and navigate to the sections library. Search for "Category Columns" 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 "Category Columns" 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 category columns. Each column can be linked to a collection and display a title, image, and optional description.
You can feature your top categories, seasonal collections, or curated groupings and reorder them easily using Shopify’s drag-and-drop editor.
Customize & Style
Fine-tune your category columns layout with Flexi’s built-in settings:
- Control the number of columns on desktop and mobile
- Adjust spacing, padding, and alignment
- Customize image ratios and text placement
- Update 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 Category Columns section works seamlessly with Dawn, Horizon, and all Online Store 2.0 themes.
Dawn Compatibility
Dawn is Shopify’s reference theme, and the Flexi Category Columns section follows the same layout patterns, spacing conventions, and responsive behavior used throughout Dawn.
This allows your category columns to inherit your theme’s typography, button styles, and overall visual language by default, while still giving you full control through Flexi’s customization options.
Horizon & Modern Framework Support
Horizon represents Shopify’s next-generation theme framework. The Category Columns 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
Each Flexi section is scoped, isolated, and performance-optimized. This means you can:
- Add or remove Category Columns without touching theme code
- Preview changes safely before publishing
- Reuse the same section across multiple themes
- Switch themes without rebuilding your navigation layout
Whether you're using Dawn, Horizon, or a heavily customized Online Store 2.0 theme, the Flexi Category Columns section adapts automatically — helping customers find what they’re looking for faster and improving overall store usability.