Skip to content
QuantCDN

Content schemas

Studio reads each project’s Astro content collections and lets you edit their schemas visually. Collections are defined in src/content/config.ts using Zod, and Studio parses that file to drive both the schema view and the form fields that authors see when editing entries.

How schemas work

Section titled “How schemas work”

Content lives in src/content/{collection}/ as Markdown or MDX files with YAML frontmatter. Each collection’s Zod schema describes the shape of that frontmatter, and Studio uses it to generate the field controls in the entry editor. When you change a schema in Studio, it rewrites src/content/config.ts directly — there is no separate CMS configuration to maintain.

For schemas that use simple Zod patterns (plain z.object shapes with the supported field types) Studio shows an editable schema. Schemas that use advanced patterns — discriminated unions, deep transforms, references to other collections — are marked Advanced and can only be edited via the code editor.

Schema view

Section titled “Schema view”

Open Schema from the Studio nav rail to see every content collection in the project. Each collection card shows:

Detail Description
Name The collection key from config.ts
Data path The directory that holds the collection’s entries
Field count Number of fields defined in the schema
Entry count How many entries currently exist
Status badge Editable for schemas Studio can edit visually, Advanced for those that must be edited as code

The toolbar provides a search box (filter by collection name or data path), a grid/list view toggle, and a New collection button.

Creating a collection

Section titled “Creating a collection”

Click New collection to open the create modal. You’ll be asked for:

  • Collection name — the modal hint reads “lowercase letters, numbers, and hyphens only”; under the hood hyphens are converted to underscores so the stored name (used as a JavaScript identifier) starts with a letter and is 50 characters or fewer.
  • Data path — auto-filled to src/content/{name}. Adjust if your content lives elsewhere.
  • Start from — choose Blank (creates a collection with title and description fields) or Copy from an existing editable collection (clones its field definitions).

Click Create collection to confirm. Studio then:

  1. Adds the new collection to src/content/config.ts.
  2. Creates the data directory (with a .gitkeep placeholder).
  3. Scaffolds a detail page template so the collection is renderable in your site.

After creation, Studio redirects you to the schema editor for the new collection.

Schema editor

Section titled “Schema editor”

Opening any editable collection from the schema view launches the schema editor. The toolbar shows the data path, entry count, and field count, plus a Save schema button that activates once you have unsaved changes (an Unsaved changes badge also appears).

Fields

Section titled “Fields”

Each field is shown as a card with its name and current type. For each field you can:

  • Change the type — pick from the dropdown: String, Number, Boolean, Date, Enum, Image, or Tags.
  • Toggle required — click the star button to mark the field required or optional. Marking a field required clears any existing default.
  • Set a default value — for optional fields, enter a default. The control matches the field type: a true/false/None dropdown for booleans, a dropdown of options for enums, a tag input for tags, and a plain input (text or number) otherwise. A small clear button removes the default.
  • Edit enum options — enum fields show their list of options inline; add a new option in the input and press Enter, or click the remove icon on any option to delete it.
  • Reorder — drag the handle on the left of each card to move it; the new order is reflected in the saved schema.
  • Remove the field — click the trash icon. The change isn’t persisted until you save.

Adding a field

Section titled “Adding a field”

Click Add field at the bottom of the field list. Enter a name (letters, numbers, and underscores; must start with a letter) and pick a type, then click Add. The new field is appended; click Save schema to commit it.

Field types

Section titled “Field types”
Type Editor control Use for
String Text input Titles, descriptions, slugs, free-form text
Number Number input Sort order, ratings, counts
Boolean Checkbox / toggle Draft state, feature flags
Date Date picker Publish dates, event times
Enum Dropdown of fixed options Status, category, content type
Image Media picker (opens the media browser) Hero images, thumbnails, avatars
Tags Tag input (array of strings) Keywords, topic lists

In addition to those, the entry editor also renders Array and Object controls when a schema includes nested arrays or objects, but those types can only be authored in the code editor — they don’t appear in the schema editor’s type dropdown.

Saving

Section titled “Saving”

Click Save schema to write the updated definition back to src/content/config.ts. Studio re-parses the file and refreshes the entry editor forms. The button is disabled while there are no unsaved changes.

Deleting a collection

Section titled “Deleting a collection”

A Danger zone appears below the field list. Clicking Delete removes the collection’s entry from src/content/config.ts after you confirm. Content files in the data directory are not deleted — they remain in the repository.

Advanced schemas

Section titled “Advanced schemas”

If a collection’s schema uses patterns Studio can’t safely round-trip, the schema view shows an Advanced badge and a banner appears in the editor with a link to open src/content/config.ts in the code editor. Make changes there and save; Studio will pick up the new schema on the next load.

Next steps

Section titled “Next steps”