Skip to content

gatsby-theme-catalyst-blog

This adds a blogging interface using MDX, similar to gatsby-theme-blog-core with some custom modifications. The theme can be added to any existing Catalyst-based site and will add blog functionality. This is a minimal implementation that is not designed to be used in a production site, but rather as a jumping off point for a production site.

The main features added to this blog theme are:

  • Support for a featured image on the blog posts
  • Support for a social image on the blog posts
  • Support for RSS feed
  • Support for categories and tags
  • Support for different post types in the frontmatter to allow for conditional styling of posts
  • Drafts flag in frontmatter so you can keep posts in your repo that are drafts and not built in the final site
  • Ability to control the excerpt length used in post summaries
  • Drafts
  • Reading time support

Demos

  • gatsby-starter-catalyst-blog
  • erichowey.dev

Catalyzing Start

gatsby new catalyst-blog https://github.com/ehowey/gatsby-starter-catalyst-blog

Theme options

OptionValuesDescription
contentPathStringDefaults to “content/posts”, determines where the posts are created from.
assetPathStringDefaults to “content/assets”, determines where the post assets like images are located.
basePathStringDefaults to “/blog”, determines the page location for the post list.
excerptLengthStringDefaults to “140”, determines the length of the excerpt use for post summaries.
postListTitleStringDefaults to “Posts”, allows you to control the title of your post page, e.g. “Blog” or “Writing” or “Digital Garden”
displayPostListTitleBooleanDefaults to true, allows you to remove the visual title of your post page but keep it in the page title in the browser.
rssTitleStringDefaults to “RSS Feed”, used as the title for your sites RSS feed.

Example Config:

{
resolve: `gatsby-theme-catalyst-blog`,
options: {
basePath: `/`,
contentPath: `src/content/posts`,
assetPath: `src/content/post-images`,
excerptLength: `280`,
}
}

Frontmatter Fields

The following fields are available in front matter.

FieldRequired?ValuesDescription
titleYesStringTitle of the post
dateYesDatePublication date, e.g. 2019-04-15
subTitleNoStringSub title or deck for blog posts
authorNoStringAuthor of the post
featuredImageNoStringFeatured image to be used for the post
featuredImageCaptionNoStringCaption for the featured image
socialImageNoStringSocial image to be used for the post
slugNoStringOptionally used to specify the link slug for the post
authorLinkNoStringUsed as a link for the author name in the post summaries
tagsNoArrayTags for the post, [“tag1”, “tag2”, “tag3”]
categoriesNoArrayCategories for the post, [“cats”, “dogs”, “snakes”]
keywordsNoArrayKeywords used for SEO, [“key1”, “key2”, “key3”]
draftNoBooleanDefaults to false, set to true if a post is a draft

Example frontmatter:

---
title: Hey, a draft post
date: 2019-04-15
featuredImage: ../assets/featured1.jpg
socialImage: ../assets/post1-social.jpg
author: Eric Howey
authorLink: https://twitter.com/erchwy
tags: [Wicked, Awesome, Radical]
draft: true
slug: /blog/custom-post-slug
---

© 2020 Gatsby Theme Catalyst