App blocks

PDP Accordion setup

Product detail page with a large accordion flyout panel

Create reusable rows

Content → Metaobjects → Product Accordion. Each entry is one row or flyout panel.

  • Internal title — admin-only label
  • Accordion title — heading shoppers see
  • Accordion text content — rich text body
  • Size guide — optional Size Guide entries, used when the title contains Size

Attach rows to a product

The block reads app.accordion first, then custom.accordion. For merchant editing, add a product metafield:

  1. Settings → Custom data → Products → Add definition
  2. Name: Accordion
  3. Namespace and key: custom.accordion
  4. Type: List of metaobjects → Product Accordion
  5. Do not pin it. Shopify cannot pin this field. It still works unpinned.
  6. On a product: Metafields → View all → Accordion → select entries

Size Guide

Size Guide metaobjects have a name, HTML table, and optional image. Attach them on a Product Accordion entry whose title contains Size.