Skip to content

Authoring posts

To create a new post, create a new directory in the src/content/posts directory. The name of the directory will be used as the slug for the post. Inside that directory, create an index.md file. This is where your frontmatter and content will live.

Refer to the schema in src/content/config.ts for the available frontmatter options.

src/content/config.ts
const blog = defineCollection({
type: "content",
schema: ({ image }) =>
z.object({
title: z.string(),
description: z.string(),
publicationDate: z.coerce.date(),
image: image()
.refine((img) => img.width >= 1200, {
message: "Image should be 1200px × 630px.",
})
.optional(),
imageAlt: z.string().optional(),
tags: z.array(z.string()).optional(),
}),
});

Frontmatter

The frontmatter for a post is defined in the index.md file. The frontmatter is written in YAML format and is used to provide metadata about the post.

Example Frontmatter

src/content/posts/my-first-post/index.md
---
title: My First Post
description: This is my first post on my new blog.
publicationDate: 2024-08-26
# make sure to co-locate the image in the same directory as the post
image: ./my-first-post.jpg
imageAlt: My First Post
---

Open Graph Images

Make sure to co-locate the image you want to use for your Open Graph image with the post. This will ensure that the image will be used for social media previews using the Open Graph protocol.

Images should be 1200px × 630px. For more information, see this blog post.

Publication date

The publication date is used to sort posts by date. It is also used to determine the most recent post on the home page.

Further reading