Blog
Build a blog system with Fumapress.
Installation
This plugin is included in fumapress.
Fumadocs MDX
If you use Fumadocs MDX, create a new collection for blog:
import { defineDocs } from "fumadocs-mdx/config";
import { blogMetaSchema, blogPageSchema } from "fumapress/adapters/mdx/schema";
export const blog = defineDocs({
dir: "content/blog",
docs: {
async: true,
schema: blogPageSchema,
postprocess: {
includeProcessedMarkdown: true,
},
},
meta: {
schema: blogMetaSchema,
},
});Add the new collection as blog content source (and give the original one a name like docs), then enable the plugin:
import { defineConfig } from "fumapress";
import { blog, docs } from "./.source/server";
import { blogPlugin } from "fumapress/plugins/blog";
export default defineConfig({
content: {
docs: docs.toFumadocsSource(),
blog: blog.toFumadocsSource({
baseDir: "blog",
}),
},
})
.plugins(blogPlugin());The plugin overrides the renderer for blog pages, by default, all pages from the blog content source are rendered as blog posts.
You can also define a isBlog() option to determine whether the page is a blog post
import { defineConfig } from "fumapress";
import { blogPlugin } from "fumapress/plugins/blog";
export default defineConfig({
// ...
}).plugins(
blogPlugin({
isBlog: (page) => page.type === "blog",
}),
);The integration is now configured, you can write blog posts under the content/blog directory (as specified in defineDocs()):
---
title: My Blog Post
description: Hello World!!!
tags: [my-tag]
---
## Introduction
Welcome to my first blog post.Other Content Sources
If you don't use Fumadocs MDX, you can keep the your content config, but make sure to define the isBlog() option like:
import { defineConfig } from "fumapress";
import { blogPlugin } from "fumapress/plugins/blog";
import { myCms } from "./my-cms";
export default defineConfig({
content: myCms.toStaticSource(),
}).plugins(
blogPlugin({
// since it is not using multi-source, `page.type` will be `undefined`.
// you need to detect it from other properties, like page path.
isBlog: (page) => page.path.startsWith("blog/"),
}),
);Options
paths
The plugin will create additional pages, you can override their pathnames.
import { defineConfig } from "fumapress";
import { blogPlugin } from "fumapress/plugins/blog";
export default defineConfig({
// ...
}).plugins(
blogPlugin({
paths: {
index: "/blog",
tags: "/blog/tags",
},
}),
);You can set to false to disable a certain page.
layouts
Override the UI.
import { defineConfig } from "fumapress";
import { blogPlugin } from "fumapress/plugins/blog";
// blog layouts
import { createHomeLayout } from "fumapress/layouts/home";
import { createBlogLayoutPage } from "fumapress/layouts/blog";
import { createBlogIndexPage } from "fumapress/layouts/blog.index";
import { createBlogTagPage, createBlogTagsPage } from "fumapress/layouts/blog.tags";
export default defineConfig({
// ...
}).plugins(
blogPlugin({
layouts: {
// shared layout for blog
layout: createHomeLayout(),
// renderer for blog pages
page: createBlogLayoutPage(),
// renderer for blog's index page
index: createBlogIndexPage(),
// renderer for blog's tags list
tags: createBlogTagsPage(),
// renderer for blog's tag info page
tag: createBlogTagPage(),
},
}),
);Last updated on