Collapsible rows
The Collapsible rows section presents content in an accordion-style layout, allowing users to expand and collapse rows to reveal additional information. This section is especially useful for FAQs, policies, product details, or any content that benefits from a compact, user-friendly display.
It helps reduce visual clutter and enhances page usability by organizing information into digestible, interactive segments.
As a preset section, it can be added, removed, and reordered as needed.
How to Configure the Collapsible Rows
In Shopify admin, go to Online Store → Themes.
Click Customize next to the Elemento theme.
In the theme editor, navigate to the desired page template (e.g., Home page) using the top preview dropdown.
In the left sidebar, click Add section, then select Collapsible Rows, or locate it if it’s already added.
Add and configure individual rows — enter titles and content for each collapsible item, and adjust styles or behavior settings.
You can drag and drop this section to reorder it on the page.
Click Save.
Section Settings
Setting
Type
Description
Heading
Text
Section title displayed above the collapsible rows.
Columns count
Range (1–3)
Set how many columns the rows are arranged into.
Color scheme
Color scheme selector
Customize background and text color combination.
Section padding
Group (Desktop / Mobile)
Set top and bottom spacing independently for each device.
Section Padding
Desktop
Top padding
Range
Space above the section on desktop view.
Desktop
Bottom padding
Range
Space below the section on desktop view.
Mobile
Top padding
Range
Space above the section on mobile view.
Mobile
Bottom padding
Range
Space below the section on mobile view.
Blocks
Row
Each Row functions as an individual collapsible item in the section.
Setting
Type
Description
Heading
Text
The clickable label that toggles the visibility of the content.
Content
Rich text
The hidden text content revealed when the row is expanded. Supports formatting.