Gatsby Blog Template

Gatsby Blog Template is an open-source GatsbyJS starter for building Markdown-driven blogs, created by Lam Pham, that bundles pagination, tags, categories, and comments out of the box.

What is Gatsby Blog Template?

Gatsby Blog Template is a GatsbyJS blog starter that converts Markdown posts and pages into a static blog with a homepage listing, tag and category pages, and an RSS feed. Input is Markdown files with frontmatter; output is a production-ready static site with SEO metadata, PWA manifest, and Disqus comments. The template runs on the Gatsby build system and is authored by Lam Pham under the MIT License, with a live demo deployed to Netlify (gb-template.netlify.com).

Key Features

• Markdown content — Posts and pages are written in Markdown; Gatsby compiles each file into a static HTML page during build.
• Tags and categories with pagination — Auto-generated /tag and /category pages paginate posts, with configurable prefix paths and headers.
• Load more on homepage — The article list loads posts in batches (default 6) and shows a Load more button when homeHasLoadmore is true.
• Prism.js code highlighting — Code blocks are highlighted using Prism.js with the Tomorrow Night theme.
• Disqus comments — Comments are lazy-loaded with a configurable shortname and a Load comments button.
• Shiba.CSS styling — Base styles come from Shiba.CSS, a lightweight CSS framework by the same author.
• Centralized SiteConfig — One file at data/SiteConfig controls site title, URL, Google Analytics ID, RSS path, user avatar, social links, navigation, footer, and PWA theme colors.
• SEO and PWA ready — Includes site manifest, theme color, background color, and alternative title settings used for homescreen and search results.

Who is it for?

• Developers starting a blog — Developers who want a pre-configured Gatsby blog can install via gatsby new and start writing posts in Markdown, skipping the scaffolding phase.
• Technical writers — Writers comfortable with Git and Markdown can publish offline and deploy to Netlify, with RSS, Disqus, and analytics already wired.
• Gatsby learners — Because it is a compact fork of gatsby-advanced-starter, it provides a readable example of how Gatsby generates pages from Markdown through templates and Node APIs.

What can you do with Gatsby Blog Template?

• Launch a personal blog: edit siteTitle, siteUrl, and googleAnalyticsID in SiteConfig, add Markdown posts, and deploy to Netlify.
• Organize content by topics: use the built-in tags and categories with pagination to structure posts, and set postDefaultCategoryID for a default category.
• Brand it your way: change themeColor, backgroundColor, userAvatar, and all footer/navigation links from SiteConfig without touching component code.
• Engage readers: plug in your Disqus shortname to enable lazy-loaded comments, and enable the RSS feed for content distribution.

How does it work?

Install with gatsby new YourProjectName https://github.com/completejavascript/gatsby-blog-template, then run npm run develop and open localhost:8000. Add posts as Markdown files; Gatsby builds tag, category, and pagination pages automatically. After updating data/SiteConfig, run a production build to generate static files for any hosting service.

FAQ

Is Gatsby Blog Template free?

Yes, it is open source under the MIT License, so it is free to use and modify for personal or commercial blogs.

How do I install Gatsby Blog Template?

Run gatsby new YourProjectName https://github.com/completejavascript/gatsby-blog-template (with Gatsby installed), then npm run develop. You can also fork the repo or clone and remove the .git folder.

What does Gatsby Blog Template include?

It provides Markdown posts and pages, tag and category pages with pagination, a load-more homepage, Prism.js highlighting, Disqus comments, an RSS feed, SEO/PWA support, and a single SiteConfig file for customization.

Who maintains Gatsby Blog Template?

The template is maintained by Lam Pham (completejavascript), a software engineer in Hanoi, Vietnam. It acknowledges gatsby-advanced-starter and taniarascia.com as its foundations.