Community Plugin
View plugin on GitHubGatsby Advent Theme
A simple and easy advent theme using Gatsby and Styled Components. Write your posts with Markdown.
Manual Setup
In your gatsby-config.js
:
npm i @agney/gatsby-theme-advent
# OR #
yarn add @agney/gatsby-theme-advent
You can start using it by adding the following to gatsby-config.js
module.exports = {
plugins: [
{
resolve: `@agney/gatsby-theme-advent`,
options: {
contentPath: "content", // Tell the theme where your markdown files are.
assetPath: "assets", // Tell the there where your cover image is.
basePath: "/december", // Tell the theme which URL to render the theme at.
},
},
],
};
Options
Options | Description | Required | Default |
---|---|---|---|
contentPath | This where markdown files are hosted | false | content |
assetPath | This is where your cover image can be | false | assets |
basePath | This is where URL where the theme is to be rendered | false |
Adding the Data
Add markdown files with frontmatter:
---
title: "This is the first advent gift"
date: "2019-12-01T22:12:03.284Z"
published: true
---
The post will be published only if the frontmatter published
is true
.
Changing the theme
Create a theme.js
file at src/@agney/gatsby-theme-advent/utils/theme.js
const theme = {};
export default theme;
If you need to keep existing theme and edit some of the values:
import merge from "lodash.merge";
import theme from "@agney/gatsby-theme-advent";
export default merge({}, theme, {
colors: {
primary: "blue",
},
});
Replacing Components (Shadowing)
Contributing
This theme makes use of Yarn Workspaces
yarn # Install packages and dependencies
yarn dev