Add meta descriptions to pandoc generation
SEO FTW! Add sitemap / robots.txt
Ugh. There's a MacOS <-> Linux difference in `cp`
ssssg
)I took heavy inspiration for this script from ssg, written by Roman Zolotarev and an updated version of this, ssg5 by u/fmash16.
ssssg
uses pandoc to generate html
from markdown
.
This script assumes a file structure as follows:
├── src
│ ├── _bottom.html
│ ├── _top.html
│ ├── config.yaml
│ ├── css
│ │ └── style.css
│ └── posts
│ ├── 2021-01-01--an-example-post.md
│ └── 2022-01-01--a-cloned-post-to-show-tags.md
src/posts
directory. Special logic happens to posts (tags and a list of posts by date).src/css
directory.src/_{header,top,bottom}.html
files are optional but useful for making sites look half-decent.You should write your posts in markdown. Frontmatter is a vital part of how this script works. Each post should have these frontmatter fields:
date
title
description
tags
An example
---
date: 2022-01-01
title: An example post title
description: This is a super cool way to generate static stites
tags: ssssg simple web
---
.. the rest of the md document..
The rest of the post should be in markdown.
The src/config.yaml
file contains extra variables that you may want built into the site.
For example, take a look at mine:
base_url: https://wclarke.net
index_md: Hello!👋😃\n\nI'm a software engineer based in the UK.
title: 🚀 Will Clarke
rss_title: Will Clarke's Blog
rss_description: Some random ramblings of a sleep-deprived software engineer
Here's an example script to get you up and running. Alternatively you can look at https://git.sr.ht/~will-clarke/blog for inspiration.
mkdir -p src/posts src/css
echo "---
date: 2022-01-01
title: An example post title
description: This is a super cool way to generate static stites
tags: ssssg simple web
---
Here's the actual Markdown content
- nice
" | tee \
src/posts/2021-01-01--an-example-post.md \
src/posts/2022-01-01--a-cloned-post-to-show-tags.md
echo "
---
title: All about me
---
Some self-centered ramblings
" > src/about.md
echo "<h1>Hey everyone</h1>
<nav>
<a href=\"/about.html\">about</a>
<a href=\"/tags.html\">tags</a>
<a href=\"/posts.html\">posts</a>
</nav>" > src/_top.html
echo "<footer>That's all Folks!</footer>" > src/_bottom.html
echo "h1 {color: red;}" > src/css/style.css
./ssssg