I’m working on several writing projects at the moment which will be published online. A CMS like WordPress or Drupal would be overkill, as the content is static and there is no user interaction such as comments. Until now I’ve been using Server Side Includes to include a common header and footer, but even that required a Docker setup with Apache. I wanted to switch to Hugo, which has its own built-in local server (and is available as a Snap). I also wanted to use Simple.css, a lightweight CSS framework that:
- Supports semantic HTML (no need to add divs with classes etc.)
- Respects light/dark mode preference of the browser (e.g. I have sites switch to dark mode in the evening)
- Auto-adjusts to different screen sizes
- Weighs in at less than 14KB (less than 5KB when compressed)
However, I didn’t know how to create a new theme in Hugo, and that felt like a lot of work. Fortunately someone else has done everything for me and published it on GitHub as hugo-simple.
The steps I followed were:
- Create new site:
hugo new site phpsecurity.uk - Copy .gitignore from GitHub:
wget https://raw.githubusercontent.com/github/gitignore/refs/heads/main/community/Golang/Hugo.gitignore -O .gitignore - Add theme as a submodule:
git submodule add https://github.com/maolonglong/hugo-simple.git themes/hugo-simple - Switch to using the new theme:
echo "theme = 'hugo-simple'" >> hugo.toml
I also did some extra configuration to get rid of the RSS link and a few other tweaks, but those are specific to my requirements and aren’t necessary to get up and running.