CMS

Editorial Grid

Editorial-style grid of cards with optional featured-card emphasis, driven by a cards array.

Loading playground

Overview

EditorialGrid is the magazine-style grid for marketing collections, content rows, and curated lookbooks. Cards are passed via the cards prop as an array of CardProps; the first N cards (controlled by featuredCount, default 2) render as a featured row, and the rest fill a secondary grid below.

An optional grid-level header (caption, heading, subline) sits above the rows for editorial context. Card content itself is driven by the data in each CardProps entry.

Key Business & UX Benefits

The magazine-style grid signals editorial quality, lifting perceived brand value on lookbooks and curated collections.
featuredCount gives editors a built-in spotlight for hero stories, so the top picks always get the visual weight they need.
A single cards array drives the whole layout, so editors stage rotations in Studio without authoring per-card markup.
The grid-level header pairs a caption, heading, and subline with the row layout, providing editorial context without a separate section.

Feature List

Cards driven by a flat cards array (CardProps[]) rather than child markup
featuredCount splits the array into a featured first row plus a secondary row
Optional caption, heading, and subline render as a grid-level header above the rows
Magazine-style grid signals editorial quality on lookbooks and curated collections
Editors curate the cards array in Studio while the responsive layout handles breakpoints automatically

API Reference

Prop	Default	Type
`cards`required		`CardProps[] { caption, heading, subline, 14 more }`
`caption`		`string`
`heading`		`string`
`headingAs`		`TextGroupHeadingAs ("h1" \| "h2" \| "h3" \| "h4" \| "h5" \| "h6" \| 2 more)` Semantic HTML element for the heading (h1-h6 or div). Defaults to h2.
`subline`		`string`
`sublineAs`		`TextGroupSublineAs ("h1" \| "h2" \| "h3" \| "h4" \| "h5" \| "h6" \| 3 more)` Semantic HTML element for the subline (p, h2-h6, div). Defaults to p.
`featuredCount`	`2`	`number` Number of cards rendered as featured (large) tiles in the first row. Defaults to 2.

Edit this pageorReport an issue

Content Grid

Generic responsive grid for cards, tiles, and other slotted content.

Media Gallery

Fullscreen lightbox dialog for multi-image viewing with zoom, navigation, and a thumbnail strip.