While working on a couple of Hugo themes over the weekend, I remembered how completely baffled I was, when I first started working with Hugo, by how exactly a theme was put together and how all those bits and fragments of template files and template code worked.
So I thought I’d put together the most basic functional Hugo theme I could come up with, which still demoed the things I remember being confused by when I started out:
A custom homepage
Static page[s]
Posts organised under a separate ‘Blog’ section
Filtering pages by tag
Using some basic template code like variables, loops, if…else
I’ve also commented everything I could think of in the code. So [hopefully!] it’ll start to make some kind of sense, as you poke through it.
I’m not really sure if this is a worthwhile venture yet. Reading the posts here, I get the feeling that most folks who visit these forums are already pretty knowledgeable. But, on the off-chance some of you are feeling as befuddled as I was, when I started out, here is Hugo Skeleton Site for your tinkering pleasure:
[BTW: I’m aware that there are certain things I’ve not done in the most ideal ‘Hugo way’, but sometimes I had to be a bit inefficient to keep things as simple as possible. I’m also still learning myself, so there may well be idiocies included free of charge too]
Comments, criticisms, corrections, etc. to the usual address.
One comment: You have a reference to a CSS file in the header, but it doesn’t exist. It should. I think the reference to the “90s design” is funny, but people want a stylesheet today. And it doesn’t need to contain much, but should be there so people understand where to put it and how to link to it.
My bad. Part way through working on this, I changed the name from “hugoskeletonsite” to “hugoskeletontheme” and forgot to update the name of the .css file.
You’re absolutely right. There’s “basic” and there’s “Aaargh! - My eyes are bleeding!” and I think, I ventured into that territory, in my aim to keep it ‘Bare-Bones’
I’ve uploaded a newer version with some minimal CSS styling which, while it won’t win any beauty contests, at least doesn’t look like it was ‘beaten to death with the ugly stick’, any more.
Ach! –How did I miss that?
The perils of 2:00AM “shall I go to bed now and check this again in the morning, or push it to the repo now?” coding sessions!
Thanks for the useful comments and for casting a beady eye over it.
This seems very promising as documentation. Is this effort still going on? Or is there a documentation project for hugo?
It seems to me that to make hugo more popular the most needed thing is improve the documentation so it teaches how to create a website. I keep reading the documentation but still fail to understand how I am supposed to go about creating a website.
If there is a writing of documentation going on, I would like to take part in that effort.
PS Sorry for replying to old topic, but I did not find promising new threads.
I’ve not updated the repo for a long time, as it was just meant to be a very basic intro as to what goes where and why ––aimed at people wanting to get started with building a Hugo theme from scratch.
If you just want to get a Hugo site up and running as quickly and painlessly as possible, you’re far better off starting from one of the many pre-built themes and then twiddling with that:
That said, if there’s anything else that folks think should be added to the repo [and which falls under the “newbie basics” heading], let me know and I’ll look at updating it accordingly.
BTW: The HugoSkeletonSite repo is just a personal project, from an end user. I’m not connected with the Hugo project itself, in any way. So can’t comment on what plans may or may not exist for the official documentation.