Collections

Think of a collection as anything you'd want multiple instances of. A series of blog posts, cooking recipes, or testimonials from happy customers.

Collections are defined within the collections key of the Keystatic config. Each collection has its own key and is wrapped in a collection() function.

Example

Here's how you'd define a testimonial collection, where each entry has an author and a quote fields:

// keystatic.config.ts
import { config, collection } from '@keystatic/core';

export default config({
  // ...
  collections: {
    testimonials: collection({
      label: 'Testimonials',
      slugField: 'author',
      schema: {
        author: fields.slug({ name: { label: 'Author' } }),
        quote: fields.text({ label: 'Quote', multiline: true })
      }
    }),
  },
});

Options

Columns

columns — show additional fields in the collection list view.

By default, only the slug of each entry is displayed in the collection list.

You can show additional fields by passing a columns option, which is an array of field keys:

columns: ['title', 'publishedOn']

Default Sort

defaultSort — set the default field and direction used for sorting in the collection list view. If omitted, the default column used is the slug of each entry, and the default direction is ascending.

defaultSort: { column: 'title', direction: 'descending' }

Label

label — defines the name of the collection. This is used in the Admin UI to label the collection.

Entry layout

entryLayout — change the layout of the Admin UI for a collection entry.

Learn more on the Entry Layout page.

Format

format — provides options around the data format of your collection entries.

Learn more on the Format Options page.

Path

path — allows you to you specify where to store entries for any given collection:

path: 'custom/content/path/testimonials/*'

By default, Keystatic will store entries at the root of your project, in a directory that matches the collection key.

You can learn more about the path option on the Content organisation page.

Parse slug for sort

parseSlugForSort — a function to transform the slug of each entry into a value to be used for sorting the collection list view.

Preview URL

previewURL — used to configure Real-time Previews of your content.

Schema

schema — defines the fields that each entry in the collection should have.

Slug field

slugField — defines what field in your collection schema should be used as the slug for each item.

It's recommended to combine it with the slug field to let users customise and regenerate each slug in the Admin UI.

testimonials: collection({
  label: 'Testimonials',
  schema: {
    title: fields.slug({ name: { label: 'Title' } }),
  },
  slugField: 'title',
}),

Template

template — the path to a content file (existing collection entry or "template") to use as a starting point for new entries.


Type signature

Find the latest version of the Collection type signature at: https://docsmill.dev/npm/@keystatic/core@latest#/.Collection