Deep Dive

“The fastest auto dealership site in the world” Hundreds of hours of perf learnings, distilled

ContactSign Up for Free
Community Plugin
View plugin on GitHub

Gatsby Theme Writer

This is a minimal blogging theme intended to focus on content and readability.

See the live demo


To use this theme in your Gatsby sites, follow these instructions:

  1. Install the theme

    npm install --save @beccanelson/gatsby-theme-writer
  2. Add the theme to your gatsby-config.js:

    module.exports = {
      plugins: ["@beccanelson/gatsby-theme-writer"],
  3. Start your site

    gatsby develop


You can configure your site metadata in gatsby-config.js. Optionally, you can also configure your basePath, contentPath, and assetsPath.

Example configuration:

module.exports = {
  siteMetadata: {
    title: "My Gatsby Site",
    author: "Becca Bailey",
      "A short description of your site. This will appear in your bio.",
    siteUrl: "",
    social: {
      twitter: "my-twitter",
      instagram: "my-instagram",

If you would like to add an avatar, the bio component will look for a file named avatar.[jpeg|jpg|gif|png]. This should go in your assets folder.

Adding Blog Posts

This theme currently supports markdown posts. For more information about markdown syntax, check out this guide.

To keep a post organized witn its assets, we can create a folder structure like this:


In addition to the markdown content, each post needs frontmatter in order to display and categorize it.

title: My First Blog Post!
date: "2019-07-28"
featuredImage: "./featured.jpg"
featured: true

For more information, see the demo/ in this repository.

To add a post to the featured posts module, set featured to true in the post frontmatter. Also, for best results make sure you have set a featured image for the post. This module supports up to two featured posts at a time. Note: these posts will still appear in the main posts list as well.


If you are using this theme, I appreciate issues and pull requests!

© 2022 Gatsby, Inc.