Hugo and Static Files

Yesterday I was experimenting with the Static folder in Hugo. Hugo and other static site generators has a folder where you can usually put content that you don’t want to have changed. You can add php, css, js and more. By making this an option it is possible to have your blog as markdown files that are updated and published every time you make changes while other files remain intact.

PHP Files

I spent time converting Roman civilisation content to PHP, as well as the geography section. Now that I have invested that time in learning to use PHP in production I don’t want to lose that content by adding it as markdown pages. With PHP and HTML pages I have full creative control on how content looks and behaves.

Legacy Content

Back in the 90s and the Zeros (2000s, but I like saying zeros), we would share photos of an event by creating a gallery and sharing that. These galleries are simple html with a page for each image, and plenty of pages to update and navigate between. These pages can be brought into the 21st century but by parking them in the static folder in Hugo we keep access to them, until we have written the json or other file type to display these photo galleries as a single page app.

Hugo’s Behaviour

There is an explanation of what Hugo does to Static files. When files and folders are added to the static folder they are added to the watch list, if Hugo is running. This means that static content will automatically be updated and available on the local instance.

Static Files and the Public Folder

When you add static files to a Hugo sight Hugo will track changes and show them via the web server but they are not added to the public folder. It is up to us, to make sure that the files that are static are updated and uploaded to the server if and when we make changes to them.

That static files are not added to the publish folder is useful. I was worried that by adding thousands of files to the static folder thousands of files would be uploaded every time I wrote a blog post and published it. This isn’t the case. I do not need to take a break from blogging with Hugo, whilst I experiment with the static part, and prepare a new folder architecture.

Looking Forward

To avoid confusion, as I experiment I put all the static files in a sub-folder. In so doing I avoid the risk of duplicate file names or file names with the same names, but different extensions, confusing Hugo. I aim to keep it clean, until I have decided on what I want to achieve with my experimentation.

And Finally

I have been struggling with Eleventy and Hugo whilst it’s easy to setup one stream of content, it is not easy to have two or more in parallel. For this reason using the Static folder allows me to keep the part that already works, separate from the part that I am still working on. It enables me to put my experiment into production sooner, and to stop going around in circles.