Hugo Zettelkasten

Hugo theme for taking notes with the Zettelkasten method.

Zettelkasten can be considered as an extension to your brain where you process and store data and make connections between ideas.

Setup

Prerequisites for Hugo Pipe’s PostCSS 1

npm install -g postcss-cli
npm install -g autoprefixer

Content organization

Tags

Add tags to the front matter of each note. This gives some categorization of topics for the note and makes it possible to find related items later if there are no direct links between notes. The tags could look like this:

tags:
- Frontend
- Web development
- Hugo
- Zettelkasten

Links

Add related links to other notes in the front matter as a list to the Markdown files. The links need to be configured as a taxonomy in the Hugo configuration. 3

[taxonomies]
    tag = "tags"
    link = "links"

Example links in the fron matter:

links:
- 2020/05/01/Tailwind-css.md
- 2020/05/03/GitHub-Markdown-Tailwindcss.md
- 2020/05/01/Hugo-npm.md
- 2020/05/03/Hugo.md
- 2020/05/03/Hugo-taxonomies.md

Each page contains a File reference at the end of the page that you can use for linking.

Entry notes

You can add the following front matter parameter to stick the note to the front page as an entry note:

entry: true

Implementation details

The theme is based on the Tailwind CSS starter theme

Markdown rendering is based on the github-markdown-tailwindcss repository

Links

• Tailwind CSS
• GitHub Markdown Tailwindcss
• Using NPM with Hugo
• Hugo
• Hugo Taxonomies

Linked from

• Hugo Sort Tags by Count
• Hugo Partial Parameters

File reference: 2020/05/01/hugo-zettelkasten.md