Kitchen Sink — Body Blocks
This page is a regression fixture: every CKEditor toolbar button and every nested-entry type registered on the body field appears below in toolbar order. Update the prose around a block when its shape changes; replace evergreen oEmbed URLs if they go dark.
Headings
The body field exposes Heading 2 through Heading 6 in the heading dropdown. The page title is the only h1.
Heading 2 — section
Body copy under an h2.
Heading 3 — subsection
Body copy under an h3.
Heading 4 — minor subsection
Body copy under an h4.
Heading 5 — rarely used
Body copy under an h5.
Heading 6 — rarely used
Body copy under an h6.
Inline formatting
The bold/italic/link toolbar buttons emit bold, italic, and anchor tags. Links accept either an external URL or — via the link-picker — an internal entry reference. Combinations like bold italic and bold link compose as expected.
Blockquote (native)
The blockquote button wraps the current paragraph in a native <blockquote>. For a styled, attributable pull quote, use the Pull Quote nested entry below instead.
A native blockquote. Body styling treats it as italicized with a left border. No attribution field — that's what Pull Quote is for.
Lists
Unordered list with one nested level:
- List Item #1
- List Item #2
- Nested item #2.A
- Nested item #2.B
- List Item #3
Ordered list with one nested level:
- List Item #1
- List Item #2
- Nested item #2.A
- Nested item #2.B
- List Item #3
Inline image (native)
Inline-image demo omitted on this fixture — upload a sample to the Media volume and use the Insert Image toolbar button to demo. The native output is a <figure class="image"> with caption + alt + alignment toolbar.
Table (native)
The Insert Table button creates a native <figure class="table"> with header row, optional caption, and per-cell properties. Templates own table styling — no full tableProperties config exposed in the editor.
| Column A | Column B | Column C |
|---|---|---|
| row 1a | row 1b | row 1c |
| row 2a | row 2b | row 2c |
| row 3a | row 3b | row 3c |
Media embed (oEmbed)
The Media Embed button accepts URLs from the providers wired in mediaEmbed.extraProviders on the body field config. CKEditor stores an <oembed url="…"> tag; the shared _partials/macros/oembed.twig macro turns it into provider iframe (or, for Twitter, a blockquote + widgets.js). Adding a provider is a three-layer change: macro + extraProviders + HTMLPurifier safe-iframe regex.
YouTube
Vimeo
Spotify
SoundCloud
Twitter / X
Nested entries
The createEntry button drops in a Matrix-style entry from the shared block library. Six block types are exposed in the body picker — four shown here; Audio and Video require sample assets and are omitted from this fixture.
Callout
Highlighted aside — labeled (e.g. TL;DR) with a CKEditor body for inline emphasis and links.
CTA
Call-to-action card — headline, optional summary, link (entry or URL), optional image.
Pull Quote
Styled, attributable quotation — distinct from the inline blockquote above.
A representative pull quote — distinct from the native blockquote above by virtue of attribution and styling.
Entry List
Query-driven listing of entries by type, with pagination.
Latest content
Mixed listing of articles and podcast episodes, latest first.
Audio
Audio omitted on this fixture — upload a sample audio asset to the Media volume to demo. Native CKE has no audio plugin, so audio always lives as a nested entry. Transcript and credit travel with the asset record.
Video
Video omitted on this fixture — upload a sample video asset to the Media volume to demo. Same reason as audio. Poster image, transcript, and credit travel with the asset.