Accordion block
A disclosure panel with a title and a fragment editor body.
On this page
The Accordion block renders one disclosure panel with a title and a fragment editor body. Place several Accordion blocks together for a list of panels.
Where it is offeredLink to this section
Offered in the root and region tiers. Each panel's body uses the fragment editor.
FieldsLink to this section
| Field | Type | Label | Default | Notes |
|---|---|---|---|---|
content | richText | Content | ||
title | text | Title | Required | |
variant | radio | Variant | default | Required; Options: default (Default) |
Rendered outputLink to this section
Renders the Accordion component with AccordionTitle and AccordionContent.
ConverterLink to this section
accordionConverter renders one <Accordion> with its title and converted fragment body. Add another Accordion block for each additional disclosure panel.
CustomizingLink to this section
Import AccordionBlock from @systhemaui/payload/blocks as the starting schema for a project block. Register the definition and your renderer through customBlocks, using type: 'block' and the editor tiers you intend to support. A distinct slug creates a new block; a converter registered under the existing accordion slug takes precedence over the built-in converter. Keep the fields that renderer reads, including populated relationships and nested editor states.
See Registering blocks for the configuration pattern and Converters for the renderer contract. A project converter used in client-mode live preview also needs browser registration.