Collapsible rows

A Collapsible row is an expandable section on the product page: a heading the shopper taps to reveal a panel of text. Use one for each piece of detail that does not need to stay open, like shipping, returns, materials, or care. Each row is its own block, so you add as many as you need and order them yourself.

Add a collapsible row

1. In the theme editor, open a product template.
2. In the Product information section's blocks, click Add block.
3. Choose Collapsible row from the Products group.
4. Drag it into the position you want in the details column.
5. Edit its Heading and Body, then add more rows the same way.

Settings

• Heading: the tappable title of the row. Defaults to Shipping.
• Body: the content revealed when the row opens. It is a rich text field, so you can format the text and add links.
• Icon: the symbol shown next to the heading. Enter a symbol name, for example shipping-box.
• Open by default: shows the row already expanded when the page loads, instead of collapsed. Off by default.

This block also uses the standard Margin controls. See Common section settings.

Tips

• Add one row per topic (shipping, returns, materials) so shoppers scan to what they need instead of reading one long block.
• Leave rows collapsed by default to keep the product page short. Turn on Open by default only for the detail you most want seen.
• Each row is a separate block, so you reorder them by dragging in the section's blocks, the same as any other product block.