Multiple document fields in one collection

[etmartinkazoo]

Is it possible to have multiple document fields in a collection? I have a blog collection and would like another document field named summary in addition to the one named content. Is there documentation that addresses this? Here is my code.

  blog: {
    label: 'Blog',
    path: 'src/content/blog/*',
    slugField: 'name',
    format: {
      data: 'yaml',
      contentField: 'content',
    },
    schema: {
      name: fields.slug({ name: { label: 'Name' }}),
      publishedOn: fields.date({ label: 'Published On' }),
      draft: fields.checkbox({
        label: 'Draft',
      }),
      content: fields.document({
        label: 'Content',
        formatting: true,
        links: true,
      }),
      summary: fields.document({
        label: 'Summary',
        formatting: true,
        links: true,
      }),
    }
  },

[simonswiss]

Hey!

Yep, this will work out of the box.

Since you set the content field as your contentField, the main file generated will contain that content field in the "body" of the .mdoc file, and the other fields in the frontmatter at the top.

Except for the summary and any other eventual document fields.

For those, Keystatic will create a folder named after the entry slug, and inside there a .mdoc file named after the field:

With your code, if you created a post with a slug of hello-world, the output files would be like so:

src/content/blog/
        hello-world.mdoc
        hello-world/
                summary.moc

I copied and pasted your exact code in a new project created with the Keystatic CLI, and it worked straight away.

The reason the other document field goes into another file is that Markdown/Markdoc/MDX can only have one single content or body field below the frontmatter.

Putting the whole serialized rich text in the frontmatter would be very big/ugly.

Working with Astro content collections

I realise that makes things slightly more complex when working with Astro collections — but Astro does have a convention of prefixing files/assets with an underscore.

Sharing from a discussion with Ben Holmes from the Astro core team:

I’ll also share that we do support colocation with underscore _ directories for relative assets today! This is helpful for referencing image assets and partials from your content. You can also use the index naming to chop this off in the generated slug (ex. blog/post-1/index.md -> blog/post-1).

Here’s an example I could imagine to colocate assets on an existing post, and store a set of Markdoc partials alongside:

src/content/
  blog/
    post-1/
      _assets/
        banner.png
        demo.gif
      _partials/
        demo.mdoc
      index.mdoc

Alternatively, you can use an underscore on the file name itself rather than using nested directories:

src/content/
  blog/
    post-1/
      _banner.png
      _demo.gif
      _demo.mdoc
      index.mdoc

I imagine keystatic could support this approach to allow our existing nested directories feature and use colocated assets. Let me know if there’s more to the story though!

---

TypeScript autocomplete suggestions

PS: Make sure you wrap your whole blog collection definition in a collection() function — it will give you a lot more TypeScript hints as you define your schema:

-  blog: {
+ blog: collection({
    label: 'Blog',
    path: 'src/content/blog/*',
    slugField: 'name',
    format: {
      data: 'yaml',
      contentField: 'content',
    },
    schema: {
      name: fields.slug({ name: { label: 'Name' }}),
      publishedOn: fields.date({ label: 'Published On' }),
      draft: fields.checkbox({
        label: 'Draft',
      }),
      content: fields.document({
        label: 'Content',
        formatting: true,
        links: true,
      }),
      summary: fields.document({
        label: 'Summary',
        formatting: true,
        links: true,
      }),
    }
-  },
+  }),

[etmartinkazoo]

@simonswiss - This is all really helpful and solves my question / problem with this. I am keeping a list of such questions and am planning on a little series called "Adventures with Keystatic" in the hopes of helping people work through a few of these issues. Again, thank you so much.

[ddteeter]

Sorry to resurrect an old thread. I am attempting to do this and can’t to figure it out. With the default folder convention outlined above with content collections, since it doesn’t include any underscores, it seems Astro tries to read the nested mdx files as part of the collection, but fails because they have no front matter and therefore do not validate against the collection schema. Do I have something set up wrong or do the multiple mdx sections not work with content collections?

[simonswiss]

Unfortunately I think that Astro is still not capable of handling more than 1 rich text field per collection. It's pretty close, but I haven't been able to make it work, and have been talking with the Astro quite a bit on this.

Hopefully one day!

[ddteeter]

That's a bummer! Hopefully one day, indeed!

In the interim, is there any way to get Keystatic to emit the non-primary rich text field files starting with an underscore (_), so Astro will ignore them? Thinking maybe I could combine that with just some more specific loading with Astro.glob() to work around the content loading, for now, while maintaining the benefit Keystatic is providing?