Collapsible row
Overview
The Collapsible Row section displays expandable/collapsible content rows (accordion-style), commonly used for FAQs, policies, or detailed information. The section includes layout controls for container width, alignment, color scheme, and responsive spacing. Each Collapse row block represents one accordion item with a heading and expandable content.
Section Configuration:
Layout
| Setting |
Description |
| Container layout |
Controls how the section is sized on the page: page-width (boxed), contained-content, or container-fluid (full width). |
| Container size (Desktop) |
Sets the maximum section width on desktop as a percentage (50%–100%). |
| Text alignment (Desktop) |
Controls text alignment on desktop (left, center, right). |
| Text alignment (Mobile) |
Controls text alignment on mobile (left, center, right). |
| Color scheme |
Applies a theme color scheme to the section styling. |
Inner padding
| Setting |
Description |
| Top (Desktop) |
Adds space above the section’s inner content on desktop. |
| Bottom (Desktop) |
Adds space below the section’s inner content on desktop. |
| Left (Desktop) |
Adds space to the left of the section’s inner content on desktop. |
| Right (Desktop) |
Adds space to the right of the section’s inner content on desktop. |
| Top (Mobile) |
Adds space above the section’s inner content on mobile. |
| Bottom (Mobile) |
Adds space below the section’s inner content on mobile. |
| Left (Mobile) |
Adds space to the left of the section’s inner content on mobile. |
| Right (Mobile) |
Adds space to the right of the section’s inner content on mobile. |
Outer padding
| Setting |
Description |
| Top (Desktop) |
Adds space above the section (outside the section content) on desktop. |
| Bottom (Desktop) |
Adds space below the section (outside the section content) on desktop. |
| Left (Desktop) |
Adds space on the left side of the section (outside) on desktop. |
| Right (Desktop) |
Adds space on the right side of the section (outside) on desktop. |
| Top (Mobile) |
Adds space above the section (outside) on mobile. |
| Bottom (Mobile) |
Adds space below the section (outside) on mobile. |
| Left (Mobile) |
Adds space on the left side of the section (outside) on mobile. |
| Right (Mobile) |
Adds space on the right side of the section (outside) on mobile. |
Blocks Configuration:
Section-level blocks
| Block type |
Description |
| Collapse row |
Adds a single collapsible (accordion) row with a heading and expandable content. |
Theme block (@theme ) |
Allows theme-provided blocks to be added to this section (based on what your theme supports). |
App block (@app ) |
Allows compatible Shopify apps to add app blocks to this section. |
Heading
A heading area that introduces the collapsible content.
| Block |
Description |
| Tagline |
Displays a short line of text above the main heading. |
| Heading |
Displays the main section title. |
| Description |
Displays supporting text beneath the heading. |
Collapse row
Each collapse row contains a heading and a content area.
Collapse row: inner blocks
| Block |
Description |
| Collapsible heading |
Displays the clickable title for the row. |
| Collapsible content |
Displays the expandable content area revealed when the row is opened. |
Collapsible content: block
| Block |
Description |
| Description |
Adds the text content shown inside the expanded row. |