Built-in Components

Every new space is seeded with these built-in content models. They can be used immediately without any configuration.

Page types

Dynamic Page (`page`)

General-purpose page.

Zone	Description
`componentsAboveFold`	Visible without scrolling
`componentsBelowFold`	Below the fold

Category Page (`categoryPage`)

Used for category/collection pages.

Zone	Description
`componentsTop`	Above the product grid
`componentsBottom`	Below the product grid

Product Details Page (`productPage`)

Used for product detail pages.

Zone	Description
`componentsBottom`	Below the product information

Component types

Hero

Full-width hero banner.

Field	Type	Description
`title`	text	Main heading
`subtitle`	text	Subheading
`backgroundImage`	image	Background image
`image`	image	Foreground image
`buttons`	button[]	CTA buttons
`backgroundColor`	color	Fallback background color
`textColor`	color	Text color

Marketing banner with multiple layout options.

Field	Type	Description
`title`	text	Banner heading
`content`	richtext	Body copy
`image`	image	Banner image
`layout`	select	`left`, `right`, `center`
`backgroundColor`	color	Background color
`button`	button	CTA button

Card

Content card.

Field	Type	Description
`title`	text	Card title
`description`	textarea	Card description
`image`	image	Card image
`button`	button	Link

CategoryCard

Category showcase card.

Field	Type	Description
`categoryId`	text	Commerce category ID
`image`	image	Override image
`label`	text	Display label

Editorial

Rich text content block.

Field	Type	Description
`content`	richtext	Full rich text content

Gallery

Image grid.

Field	Type	Description
`images`	image[]	Array of images
`columns`	number	Grid column count

Grid

Layout container. Arranges child components in a grid.

Field	Type	Description
`components`	components	Child components
`columns`	number	Column count
`gap`	number	Gap between items

Accordion

Expandable sections.

Field	Type	Description
`items`	AccordionItem[]	Each item has `title` and `content` (richtext)

NewsletterBox

Email signup widget.

Field	Type	Description
`title`	text	Heading
`subtitle`	text	Description
`placeholder`	text	Input placeholder
`buttonLabel`	text	Submit button label
`backgroundColor`	color	Background color

ProductList

Product carousel connected to the commerce catalog.

Field	Type	Description
`title`	text	Section title
`categoryId`	text	Commerce category to pull from
`limit`	number	Maximum products to show

Scrollable

Horizontal scroll container.

Field	Type	Description
`components`	components	Child components (cards, etc.)

Adding custom components

To add a new component type available in all pages, create a Content Model with:

A unique api_id in PascalCase
The fields your component needs
A matching React component in components/cms/page/ in your storefront

The storefront’s render-cms-content.tsx maps api_id to the React component at render time.