It’s been two weeks now since I started using Hugo for the blog and static content on this site. In the time that has passed, I’ve fixed broken links, cleaned up the Markdown, and done a lot of under-the-hood maintenance work that none of you’ll really notice.

But I’ve also managed to cram out a few posts, like Welcome to Marble Cliffs, a narrative Cities: Skylines let’s play. It was my first proper go at writing a new post from scratch with Markdown, and sending it through my Hugo pipeline. It went surprisingly well, the only thing I missed from WordPress was its image handling. When I used WordPress, I could simply drag and drop an image into a post, and WordPress would generate the necessary responsive versions of it, and display everything correctly to the reader.

In Hugo, there’s no such feature out-of-the-box, so I had to manually resize all the Cities: Skylines screenshots used in the post myself. But I don’t think it will be that hard to get Hugo to do all the heavy lifting for me. With Markdown render hooks, I can run custom templates whenever Hugo renders an image. Then, in the custom template, I can use Hugo’s image processing feature to create the necessary responsive images sizes, and render everything correctly in HTML.

At least that’s my theory, but I haven’t really dived deep enough into the nitty-gritty to confirm that it actually holds water. If it does, it means I only need to put references to the images in valid Markdown, and Hugo will make sure they end up as responsive images in the HTML. I’d love to be able to have this complete separation of content and presentation. It means that moving from Hugo to another static site generator or CMS means I don’t have to touch the content at all when doing so.

The more I work with Hugo, the more I like it, and I recently become a sponsor of the main Hugo contributor, bep. If you use any open source projects, you should support them if you can. That might mean financially, but you can also support open source projects in other way by for instance writing code, translations, and documentation.