Eleventy Cn Blog

eleventy-cn-blog is an open-source Eleventy (11ty) starter template that generates a fast, Chinese-friendly static blog from Markdown or Nunjucks posts. Inspired by the official eleventy-base-blog, it adds Chinese URL and date support, a perfect Lighthouse score, and a set of practical features for content publishers.

What is eleventy-cn-blog?

eleventy-cn-blog is a static blog generator template built on the Eleventy static site generator, created by developer xiyuvi. It takes Markdown or Nunjucks files from a _posts directory and outputs a fully static website into a _site folder, ready to deploy to any static hosting service. The template is a fork/variant of the official eleventy-base-blog, with changes focused on Chinese-language usability, such as native support for Chinese URLs and Chinese date formatting.

Key Features

• Perfect Lighthouse score — The template reports a 400/400 Lighthouse score out of the box, covering performance, accessibility, best practices, and SEO.
• Chinese URL and date support — Chinese characters in URLs work natively because the template avoids the default 11ty URL beautifier plugin, which does not handle Chinese; Chinese date formatting is also included.
• RSS and sitemap generation — An RSS feed and sitemap.xml are generated automatically for the blog.
• Code highlighting — Code blocks are syntax-highlighted in the generated pages.
• Image optimization shortcode — A custom {% image %} shortcode optimizes images directly in Markdown content.
• JSON article data — Post content is also exported as JSON, enabling the static blog to be consumed as an API; the author has connected it to a WeChat mini-program.
• Offline support — A Service Worker allows the blog to be browsed without a network connection.
• Pure front-end search — A client-side search feature with no backend finds posts directly in the browser.

Who is it for?

• Chinese-language bloggers — who want clean, localized URLs and Chinese date formatting without extra configuration or plugins.
• Performance-conscious developers — who want a static blog that scores 400/400 in Lighthouse and keeps JavaScript minimal.
• Eleventy users — who need a starter with RSS, sitemap, search, pagination, and offline capability already built in.
• Developers building mini-apps — who can reuse the JSON article export to feed content into a WeChat mini-program or similar client.

What can you do with eleventy-cn-blog?

• Personal bloggers: publish posts in _posts using Markdown or Nunjucks, then run npm run build to get a deployable static site in _site.
• Front-end developers: use the JSON article data as a lightweight API endpoint to power a separate front-end or mobile app.
• Offline-first sites: enable the Service Worker so readers can access cached pages without a connection.
• Fast-content sites: take advantage of the 4KB link preloading snippet and View Transitions for a smoother reading experience.

How does eleventy-cn-blog work?

The template follows a straightforward workflow: clone the repository, run npm install to install dependencies, run npm run serve for a local development server, and write posts in _posts. Running npm run build compiles the content into static files in _site, which you then deploy to a server or hosting platform. This mirrors the documented usage of Eleventy and eleventy-base-blog.

Pros and cons

• Pros: Nearly no JavaScript is required for core functionality; JS-dependent features can be removed manually. The template achieves a 400/400 Lighthouse score and includes RSS, sitemap, and search.
• Cons: The View Transitions API is still a draft and requires enabling chrome://flags#view-transition-on-navigation in the latest Chrome. Also, Markdown filenames that are purely numeric, Chinese, or spaces break the View Transitions effect, so posts must use descriptive filenames.

Pricing

eleventy-cn-blog is free and open source. You can clone, modify, and deploy it without any licensing cost, though you should follow the repository’s open-source terms.

Alternatives

• eleventy-base-blog — the official Eleventy starter blog that this template builds upon, but without Chinese-specific URL and date fixes.
• Hugo — a Go-based static site generator with a large theme ecosystem and different template syntax.
• Astro — a component-driven static site builder that also supports Markdown content and partial hydration.

FAQ

Does eleventy-cn-blog support Chinese URLs?

Yes. The template bypasses the Eleventy URL beautifier plugin that fails on Chinese characters, so article URLs can include Chinese directly without extra configuration.

Is the blog usable offline?

Yes. The template includes a Service Worker, which caches pages so readers can browse the blog without a network connection. This requires a small amount of JavaScript.

Can I remove the JavaScript features?

Yes. The project deliberately keeps JavaScript minimal, and you can manually delete the JS files that support non-essential features like link preloading or View Transitions without breaking the core blog.

What is the Lighthouse score?

The README reports a perfect 400/400 Lighthouse score out of the box, covering performance, accessibility, best practices, and SEO.

Why are some filenames not allowed?

The View Transitions feature relies on a view-transition-name value derived from the filename; numeric-only, Chinese-only, or space-only filenames produce an invalid value, so use descriptive filenames instead.