Content Models

Content models define the editable fields for each component type. They determine what editors see in the property panel when editing a component.

Field types

Type	Description	Editor UI
text	Single-line string	Text input
textarea	Multi-line string	Textarea
richtext	HTML content	Textarea with HTML
number	Numeric value	Number input
boolean	True/false	Checkbox
select	One of predefined options	Dropdown
color	Color value	Color picker + hex input
image	Image with alt text	Media picker
images	Multiple images	Media picker (multi)
button	Label + link pair	Two text inputs
components	Nested child components	Component list with CRUD
product-items	Product SKU list	Product picker modal
nav-categories	Navigation mega menu structure	Nested category editor
footer-columns	Footer column/link structure	Nested column editor
accordion-items	Collapsible title/content pairs	Expandable item editor
carousel-slides	Image slides	Slide editor
json	Any JSON value	JSON textarea

Internal title

Every content model must designate one field as the Internal Title. This field is used as the display name in the component list sidebar and for search.

• Only one field per content model can be the internal title
• Saving fails if no field is marked as internal title
• Built-in schemas default to the name field

In the content model editor, check the Internal Title checkbox on the desired field. Checking it on one field automatically unchecks it on all others.

Localizable fields

Each field can be marked as Localizable in the content model editor. Localizable fields store separate values per locale:

{
  "title": {
    "_localized": true,
    "en-US": "Welcome",
    "de": "Willkommen"
  }
}

Non-localizable fields (like colors, layout options) are shared across all locales.

Some field types are localizable by default: text, textarea, richtext, button, image, images, nav-categories, footer-columns, carousel-slides, accordion-items.

Auto-inferred fields

When a component has data properties that don’t match any field in its content model, the CMS auto-generates editor fields for them in an “Additional Properties” section.

Inference rules:

• string values become text fields
• number values become number fields
• boolean values become boolean fields
• Objects with desktop/mobile become image fields
• Objects with label + url/link become button fields
• Everything else becomes a json textarea

This ensures all data is always editable, even if the content model is incomplete.

Components field type

The components field type supports nested component editing:

• Add — type picker dropdown with search
• Edit — click to expand inline, shows all fields from the child component’s content model
• Delete — remove button per item
• Reorder — up/down arrows

This is used for Grid items, Scrollable items, and any container component.

Schema resolution

The CMS merges built-in schemas with database content models:

1. Built-in schemas (hardcoded in shared/schemas/index.ts) provide defaults
2. Database content models (from the content_models table) override built-ins
3. The merged result determines what fields appear in the editor

When creating custom components, define the content model in the CMS under Content Models. The editor will automatically render the right field editors.