Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/andrewmmc/gatsby-theme-minimalism
📙 Simple Gatsby theme for blog and static website.
https://github.com/andrewmmc/gatsby-theme-minimalism
gatsby gatsby-plugin gatsby-theme gatsbyjs
Last synced: 19 days ago
JSON representation
📙 Simple Gatsby theme for blog and static website.
- Host: GitHub
- URL: https://github.com/andrewmmc/gatsby-theme-minimalism
- Owner: andrewmmc
- License: mit
- Created: 2020-05-17T15:22:39.000Z (over 4 years ago)
- Default Branch: master
- Last Pushed: 2020-11-25T13:36:23.000Z (about 4 years ago)
- Last Synced: 2024-11-15T04:36:27.663Z (about 2 months ago)
- Topics: gatsby, gatsby-plugin, gatsby-theme, gatsbyjs
- Language: JavaScript
- Homepage: https://github.com/andrewmmc/gatsby-theme-minimalism
- Size: 2.57 MB
- Stars: 3
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
# gatsby-theme-minimalism
It's a simple Gatsby theme based on [Chakra UI](https://chakra-ui.com) for blog and static website. Use it easily to create contents with `.md` format.
## Preview
- [Demo Website](https://gatsby-theme-minimalism.andrewmmc.dev)
## 🚀 Getting started
```bash
npm i gatsby-theme-minimalism
## or
yarn gatsby-theme-minimalism
```
## How to use
Edit `gatsby-config.js` and replace `siteMetadata` by the following configs:
```js
module.exports = {
siteMetadata: {
title: '',
author: 'Author Name',
authorDescription: 'Author description here!',
description: 'Site description',
siteUrl: 'https://examplesite.com',
seoKeywords: [],
location: 'Hong Kong',
email: '[email protected]',
social: {
github: 'github',
linkedin: '',
facebook: 'facebook',
instagram: 'instagram',
twitter: 'twitter',
medium: '',
},
},
};
```
And add the following configs to `plugins` array:
```js
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 |
## Writing contents and replacing images
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
└── ...
```
## Customizing the theme
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](https://www.gatsbyjs.org/blog/2019-04-29-component-shadowing/) for the usage.
## Author
- [Andrew Mok](https://andrewmmc.com) (@andrewmmc)
## Questions or bugs report?
- Please feel free to [open an issue here](../../issues) or [contact me via email](mailto:[email protected]).