Jamstack Eleventy Custom

Jamstack Eleventy Custom is a static blog starter built from scratch with Eleventy (11ty) that adds search, taxonomy, sticky sidebars, math rendering, and a GitHub Actions deployment workflow to a plain 11ty site.

What is Jamstack Eleventy Custom?

This template is a demo/sample repository for building Eleventy sites from scratch, with blog-specific features layered on top. It takes Markdown files with front matter (plus optional local images stored in the same folder as posts) and outputs a fully static HTML site via the Eleventy static site generator. The project is maintained as a public GitHub repository with 7 stars and includes sample posts to showcase every feature. An example production site, reflectivetechconsulting.com, is based on this source.

Key Features

• Search inside posts — a client-side search lets visitors find content within the blog's posts without an external service.
• Taxonomy and nested categories — posts can be organized by tags and nested categories, with dedicated taxonomy screens and nested paging (e.g., /tag/ddd/1/).
• Sticky sidebars — recent articles, articles in a series, similar articles, tags and categories, a tag cloud, and a table of contents are all available as sticky sidebar widgets.
• RSS plugin — an RSS feed is generated for the blog.
• MathJax and Mermaid integration — mathematical notation and Mermaid diagrams render inside posts.
• Cookie consent and comments — a simplified cookie consent banner and integrated Giscus (GitHub Discussions as comments) are included.
• Bootstrap 5.3 and SCSS styling — layouts rely on Bootstrap 5.3 color schemes, and all custom styling is refactored into SCSS fragments broken out from a single main.scss.
• GitHub Actions workflow — the repository includes a GitHub Actions workflow for automated builds/deploys, plus npm scripts for testing and building.

Who is it for?

• Developers learning Eleventy — they get a from-scratch implementation showing how to add blog features like paging, navigation, and search to an 11ty site.
• Blog owners who want a self-hosted static blog — the template produces a fast static site with SEO-friendly output, RSS, and taxonomy.
• Developers needing a minimal but extensible blog starter — it distinguishes prod vs dev environments (sample posts appear in dev, can be excluded from prod) and keeps layouts and styling modular.

What can you do with it?

• Create a blog with a full taxonomy system — use tags and nested categories to organize posts, with sticky sidebar widgets for recent, similar, and series articles.
• Deploy automatically with GitHub Actions — commit changes and let the workflow build and publish the site. Note: if hosting under a custom domain with GitHub Pages, a CNAME file must be added to the output or the setting will reset on every redeploy.
• Write posts with local images and math/diagrams — store pictures in the same folder as the Markdown file, and use MathJax for equations and Mermaid for diagrams.

How does it work?

The site is built with Eleventy, which processes Markdown files and SCSS through npm scripts. Content is stored as Markdown with front matter; posts can reference images stored in the same folder. The .eleventy.js configuration includes a switch to distinguish prod and dev environments, so sample posts are available in dev but can be removed from production builds.

Pros and cons

• Pros: Feature-rich for a static site; includes search, sticky sidebars, taxonomy, RSS, MathJax/Mermaid; no database or server required; GitHub Actions workflow included.
• Cons: When using GitHub Pages with a custom domain, you must add a CNAME file to the output folder or the custom domain setting will be lost on each redeploy (as documented in the repo).

FAQ

Is Jamstack Eleventy Custom free?

Yes, the repository is publicly available on GitHub and can be cloned and used freely; no licensing or pricing information is mentioned in the README.

What static site generator does it use?

It uses Eleventy (11ty), a Node.js-based static site generator created by Zach Leat, and the site is built from scratch rather than forked from an existing starter.

Does it include a search feature?

Yes, there is a client-side search that runs across posts, plus a table of contents for within-post navigation.

How do I remove the sample posts in production?

The .eleventy.js config contains a switch for prod and dev environments; in prod the sample posts are excluded. The production site reflectivetechconsulting.com keeps samples only in dev.

Can I use a custom domain with GitHub Pages?

Yes, but you must add a CNAME file with your domain to the output directory; otherwise every redeploy will reset the custom domain setting.