Getting Started
A Starlight plugin to add a blog to your documentation site.
- Link to the blog in the header
- Post list with pagination
- Global and per-post authors
- Tags
- Custom sidebar with recent posts and tags
Check out the demo for a preview of the blog.
Prerequisites
You will need to have a Starlight website set up. If you don’t have one yet, you can follow the “Getting Started” guide in the Starlight docs to create one.
Install the plugin
Starlight Blog is a Starlight plugin. Install it using your favorite package manager:
npm install starlight-blog
pnpm add starlight-blog
yarn add starlight-blog
bun add starlight-blog
ni starlight-blog
Configure the plugin
The Starlight Blog plugin can be configured in your Starlight configuration in the astro.config.mjs
file.
import starlight from '@astrojs/starlight'import { defineConfig } from 'astro/config'import starlightBlog from 'starlight-blog'
export default defineConfig({ integrations: [ starlight({ plugins: [starlightBlog()], title: 'My Docs', }), ],})
The Starlight Blog plugin behavior can be tweaked using various configuration options.
Extend frontmatter schema
Extend Starlight’s frontmatter default schema to add support for customizing individual blog posts using their frontmatter in the src/content/config.ts
file:
import { defineCollection } from 'astro:content';import { docsSchema, i18nSchema } from '@astrojs/starlight/schema';import { blogSchema } from 'starlight-blog/schema'
export const collections = { docs: defineCollection({ schema: docsSchema({ extend: blogSchema() }) }), i18n: defineCollection({ type: 'data', schema: i18nSchema() }),};
Create your first blog post
Create your first blog post by creating a .md
or .mdx
file in the src/content/docs/blog/
directory:
---title: My first blog postdate: 2023-07-24---
## Hello
Hello world!