It's a simple Gatsby theme based on Chakra UI for blog and static website. Use it easily to create contents with .md format.
npm i gatsby-theme-minimalism
## or
yarn gatsby-theme-minimalismEdit gatsby-config.js and replace siteMetadata by the following configs:
module.exports = {
siteMetadata: {
title: '',
author: 'Author Name',
authorDescription: 'Author description here!',
description: 'Site description',
siteUrl: 'https://examplesite.com',
seoKeywords: [],
location: 'Hong Kong',
email: 'no-reply@email.com',
social: {
github: 'github',
linkedin: '',
facebook: 'facebook',
instagram: 'instagram',
twitter: 'twitter',
medium: '',
},
},
};And add the following configs to plugins array:
module.exports = {
plugins: [
{
resolve: 'gatsby-theme-minimalism',
// You can edit the following options, or ignore them if you don't care.
// Note that siteName is required for RSS.
options: {
siteName: '',
mapId: '',
},
},
],
};| Options | Required? | Description |
|---|---|---|
siteName (string) |
Y | Required for RSS |
mapId (string) |
N | Google Maps My Maps ID for about page, will not render if empty |
Check example-site for the sample folder structure for blog posts, about page and projects page.
You can replace the markdown files in content to update your website. You can change the images by replacing images in assets folder.
.
├── assets
| ├── profile.jpg
| └── ...
├── content
| ├── about
| | └── index.md
| ├── blog
| | ├── 2020
| | | └── title
| | | └── index.md
| | └── ...
| ├── notes
| | ├── 2020
| | | └── title
| | | └── index.md
| | └── ...
| └── projects
| └── title
| | └── index.md
└── ...
To customize the colors used in the theme, shadow the files inside src/gatsby-theme-minimalism/themes. To extend the colors usage, import the base colors and export a new color object. Check Component Shadowing for the usage.
- Andrew Mok (@andrewmmc)
- Please feel free to open an issue here or contact me via email.