My Simple Custom Blog Software

The pages on this site are generated by my own primitive blog engine. This post summarizes why I wrote my own, what my priorities for it were and how I went about achieving them.

Why Something Custom?

Originally I wanted to use Hugo[1] for this blog. I started to look for a simple theme that did not involve many dependencies and provided clean output. This quickly frustrated me because the themes were either not minimal at all or I could not get them to work with my version of Hugo. This made me take a step back and think about what I actually want as blog output. I wrote a tiny HTML header, a small test blog article in markdown and did `cat header.html > post.html && smu post.md >> post.html`. The result looked good and that convinced me that writing a small blog creation script was more rewarding and maybe even faster than configuring something existing the way I like it.

1: https://gohugo.io/

Requirements

Before jumping deeper into it, I made a list of my basic requirements:

How I Achieved These Constraints

Low Maintenance

Low Barrier to Create Content

Low Requirements on the Client

This is mostly solved by not doing anything complicated. Not adding any JS and CSS frameworks keeps the size small. Not setting a font size and not disallowing zooming makes the text readable on a wide variety of devices and by people of bad eye sight. Just using basic HTML and a few lines of CSS allows old or limited browsers and slow computers to display the page easily. I could go on for a long time here, but I'm sure you get the concept.

RSS Feed

Adding an RSS feed (an Atom[2] feed to be precise) was the most complicated part of the script. But I really love RSS and in my opinion RSS support is an essential part of a blog. I was shocked to learn that nowadays some blog engines need plugins to get RSS support! Writing something that is nearly a valid Atom feed is pretty easy. Just take the example Atom feed[3] and fill in your own values. But to make it standard compliant and work well with different clients, I also needed to

2: https://en.wikipedia.org/wiki/Atom_(Web_standard)

3: https://validator.w3.org/feed/docs/atom.html#sampleFeed

4: http://web.archive.org/web/20110514113830/http://diveintomark.org/archives/2004/05/28/howto-atom-id

Results

The HTML Output

The largest part of the CSS is the styling of the navigation bar. I could have went with a line of text links separated by spaces, but I wanted to have a clearly visible navigation at the top. Using such a small amount of CSS also removed the need for any CSS preprocessors like Sass[5].

5: https://sass-lang.com/

The Blog Script

You can find the code of the resulting script[6] on github. The blog you are currently viewing is part of the same repository and serves as example content.

6: https://github.com/karlb/karl.berlin/blob/master/blog.sh

To make the script work as intended, you should adhere to the following rules:

Feel free to contact me if you have any questions. If you want to use it for your own site, I can give some guidance. Since I don't expect many users, this is less effort than writing and maintaining good documentation.

Written on 2020-08-30.