Sure! Here’s a rewritten version of the article with a clearer, more concise tone while keeping all the essential information intact:
—
Over the years, I’ve been searching for a solid content management system (CMS) tailored for static sites—something that’s user-friendly, customizable, and doesn’t feel like overkill. While many CMS options exist, I’ve always found them lacking in some way—either they’re too complex, have awkward pricing, or require too much setup.
I love working with static site generators like Astro and Eleventy. However, asking non-technical users to manage content via Markdown files just isn’t practical. So, I had a few basic requirements for a CMS:
– Easy to use
– Minimal setup (no databases, please)
– Supports collaboration (no Markdown or Git knowledge required)
– Fully customizable fields for different content types
Enter Pages CMS—a CMS built specifically for static site generators. It’s open source, created by Ronan Berder, and available on GitHub. Its goal? To simplify content management for static sites. And it does just that.
Pages CMS offers a clean user interface powered by a single configuration file. It supports media uploads, editable files, and content collections with customizable fields. Best of all, it stores content as flat files directly in your Git repository—no backend to manage, and no need to know Git.
Authentication is flexible: users can log in with GitHub or via email using a “magic link.” And did I mention it’s free?
Pages CMS + Astro Content Collections
I’ve put together a GitHub repo using Astro’s blog starter template with Pages CMS already integrated. You can check it out here.
Astro’s content collections feature makes it easy to work with structured content from Markdown files, and Pages CMS is great at managing those files. Here’s how it works:
In Astro, we define a content collection like this:
src/content.config.ts
import { glob } from ‘astro/loaders’;
import { defineCollection, z } from ‘astro:content’;
const blog = defineCollection({
loader: glob({ base: ‘./src/content/blog’, pattern: ‘**/*.md’ }),
schema: z.object({
title: z.string(),
description: z.string(),
pubDate: z.coerce.date(),
updatedDate: z.coerce.date().optional(),
heroImage: z.string().optional(),
}),
});
export const collections = { blog };
This configuration tells Astro to look for Markdown files in /src/content/blog and apply a schema using Zod for type checking.
Configuring Pages CMS
To match this setup, we configure Pages CMS using a .pages.config.yml file:
.pages.config.yml
content:
– name: blog
label: Blog
path: src/content/blog
filename: ‘{year}-{month}-{day}-{fields.title}.md’
type: collection
view:
fields: [heroImage, title, pubDate]
fields:
– name: title
label: Title
type: string
– name: description
label: Description
type: text
– name: pubDate
label: Publication Date
type: date
options:
format: MM/dd/yyyy
– name: updatedDate
label: Last Updated Date
type: date
options:
format: MM/dd/yyyy
– name: heroImage
label: Hero Image
type: image
– name: body
label: Body
type: rich-text
This configuration tells Pages CMS where to save blog posts and how to structure each entry. The filename is dynamically generated, and the fields align with Astro’s expected schema.
You can also manage standalone configuration files. For example:
– name: site-settings
label: Site Settings
path: src/config/site.json
type: file
fields:
– name: title
label: Website title
type: string
– name: description
label: Website description
type: string
– name: url
label: Website URL
type: string
pattern: ^(https?://)?(www.)?[a-zA-Z0-9.-]+.[a-zA-Z]{2,}(/[^s]*)?$
– name: cover
label: Preview image
type: image
Media assets like images and videos can be stored in a public/media folder:
media:
input: public/media
output: /media
This ensures compatibility with Astro and Vite, which expects paths to start from /media instead of /public/media.
Connecting to Pages CMS
Once your project is set up, head over to https://app.pagescms.org/ and sign in with GitHub. Grant access to your repo (I recommend selecting just the one you need
Discover more from WIREDGORILLA
Subscribe to get the latest posts sent to your email.