Product Detail Rows

A stack of tappable rows — Product Details, Ingredients, Recommended Use, References — each showing a title and a trailing arrow. Tapping one slides its content in from the right over a dimmed page, rather than expanding it underneath the way the Accordion block does.

Use this where the copy is long enough that expanding it in place would push the rest of the page around.

Settings

Setting	What it does
Detail items	The rows to show, as Accordion Item entries. Each becomes one row, in the order listed. Connect this to the product’s own metafield so every product shows its own rows.
Detail groups	Used only when Detail items is empty. Every item inside each group becomes a row.
Block ID	Optional anchor, so you can link to this block with #your-id.

It reuses Accordion Items on purpose

The rows are built from the same Accordion Item entries the Accordion block uses. The copy is the same content either way, so you do not have to keep two separate sets of entries in sync — the same entry can appear as an accordion on one template and as a drawer row on another.

What visitors get

• A link they can share. The open panel is written to the URL, so a visitor can copy the address and send someone straight to it. Opening a panel does not add a browser-history step, so Back still leaves the page rather than closing the panel first.
• Keyboard and screen reader support. Focus moves into the panel when it opens, stays inside while it is open, and returns to the row that opened it on close. Escape closes it, as does clicking the dimmed area.
• No loading wait. Every panel’s copy is already in the page, so opening one is instant and the text is visible to search engines and AI crawlers.
• Reduced motion respected. The slide animation is skipped for visitors who ask their device to reduce motion.

A row with no title is skipped

Rows come from the entries you point the block at. An entry with an empty title is left out entirely rather than rendering a blank row — if a row is missing, check that its entry has a title.

Tips

• Keep titles short. They sit on one line beside the arrow.
• Order the entries the way you want the rows to read; there is no separate sort.
• If nothing renders at all, neither setting is pointing at any entries — the block outputs nothing rather than an empty container.