Things look different here

So this site looks different! There are a couple of reasons for this, let’s dive into them and also how the site is now generated and maintained.

Simplify the complex

In the past, this site was powered by WordPress, which is a pretty big and complex piece of software.

While it has convenient features like good content management, doing non-simple stuff needs some pretty specialist knowledge. The tipping point for me came when I wanted to add the meta tag to do automatic Fediverse attribution for links shared on Fediverse sites. This should be a simple matter off just adding this tag to the <head> portion of the site:

<meta content="@[email protected]" name="fediverse:creator">

Do you think I could figure out how to do that in the very complicated template system in WordPress without adding yet another opaque add-on to the site?

Security is Important ™

The more complex a system is, the more difficult it is to understand security around it. WordPress is very complex. I reduced the risk profile a bit by putting stuff like wp-admin behind an extra layer of authentication with Cloudflare Zero Trust (I still do this with my Bookmarks page).

But… I’d rather have a better understanding of what my site does and what attack surface it exposes. That’s pretty easy with a plain HTML site and no server-side processing at all.

Static HTML you say? For a blog? Sounds complicated!

Well… With the right tools, it’s not complicated at all. What you need is a Static Site Generator that takes what you type in a form you are comfortable with (in my case, Markdown), and turns that into a good looking web site. Then you just copy the generated site to your web server and there you go.

There are a couple of good Static Site Generator applications out there, I decided to go with Zola, purely a personal choice. With my setup, as described below, I just type my posts in Obsidian, add a bit of magic to the top of the post, and run two commands to generate and publish the site.

Getting set up

Getting set up was non-trivial, but only has to be done once, so here’s a basic description of my setup (I use Linux Mint as my daily driver, so this is Linux stuff).

Site generator

So, like I said, I selected Zola to generate my site. I looked through the themes available and decided that tabi is the closest fit for what I want my site to be. It comes with a bunch of features built in and looks pretty clean.

Since they publish a Github template, I decided to just grab that as the starting point for my site:

cd ~
git pull https://github.com/welpo/tabi-start.git thekrugers.com
cd thekrugers.com
git submodule update --init --recursive

That’s it, I now have a working base that can be seen by running flatpak run org.getzola.zola serve in the ~/thekrugers.com directory and opening http://127.0.0.1:1111 in a web browser. (OK, OK, I have an alias in my ~/.bashrc with: alias zola="flatpak run org.getzola.zola")

The next step was to edit the config.toml file, setting the following items:

  • base_url - The site’s public URL
  • title - Title of the site
  • description - Description if the site for HTML headers and stuff like ATOM/RSS feeds
  • author - Who I am
  • menu - The contents of the navigation menu at the top-right of the site
  • socials - Links to my socials at the bottom
  • fediverse_creator - See above

Now Zola can generate the site and make it pretty, this is done by running zola build in the ~/thekrugers.com directory. The final generated site is in ~/thekrugers.com/public/ and that can be copied to my web server.

Publishing

To copy the site to my web server, I created a directory /var/www/thekrugers.com, owned by my user, on my web server and told nginx that is the root of my web site. I have one of my SSH public keys from my laptop already in my authorized_keys on the web server, so it was literally just a matter of doing this (10.1.2.3 is the IP of my web server on one of my VPNs):

rsync -avP ~/thekrugers.com/public/ 10.1.2.3:/var/www/thekrugers.com/

For future publishing, I just have a little bash script sitting at ~/bin/pushblog.sh with this in it:

#!/bin/bash
cd ~/thekrugers.com
# No aliases in shell scripts
flatpak run org.getzola.zola build
rsync -avP ~/thekrugers.com/public/ 10.1.2.3:/var/www/thekrugers.com/

Editing

To make editing simpler, I decided to use Obsidian, because I’m familiar with it and it’s nifty. My main Obsidian vault sits at ~/obsidian1 on my disk, but my blog is under ~/thekrugers.com. The simple solution was to just do this:

mkdir ~/obsidian1/thekrugers.com
ln -s ~/thekrugers.com/content ~/obsidian1/thekrugers.com/
ln -s ~/thekrugers.com/static ~/obsidian1/thekrugers.com/

That’s it, really, now I can edit my blog right in Obsidian. By running zola serve in the ~/thekrugers.com directory and opening http://127.0.0.1:1111 in a web browser, I can even see the page updating as I type.

As for the “magic” at the top of the Markdown file, technically called Front Matter, this is what the Front Matter for this very post looks like:

+++
title = "Things look different here"
date = 2025-02-07
description = "So why does this site look so different now?"
[taxonomies]
tags = ["general", "tech"]
+++

One thing to look out for is changed URLs, stuff like my previous post used to sit under the root of the site (so at /nextcloud-with-two-reverse-proxies/) and now all the posts sit under /blog/ (so at /blog/nextcloud-with-two-reverse-proxies/). Luckily there is a simple way to do redirects in Zola, I just added this just above [taxonomies] in the Front Matter of that that post:

aliases = ["/nextcloud-with-two-reverse-proxies/"]