On Setting Up a Blog (Part 2)

June 1, 2021 | 7:44 pm


This is the second part of a post I already made; here is part 1 to catch up!

Alright, so with the site fully working with Hugo’s server setup. Time came for us to finally upload it to Github pages.

So a spoiler and a warning, at least learn how Github Pages actually works before starting to upload your site.

So the first attempt was just going to the repo on GH and selecting the “Pages” option and setting it to use the main branch. That didn’t work. Of course it didn’t work. Hugo doesn’t create the index in the root of the repo. So we gotta do something else.

Well we remembered that Github Actions are a thing, it’ll compile the site on push and that’ll make it easy enough. So just looked it up, and it was easy enough to copy some code into a text file; and actions started working!!

So I navigate to the new site once again!

Nothing.

I change the branch that is used for the site and…

I got the homepage!!!

…though without any of the customization we did… -_-

…and navigating to any other page lead to a 404… ;-_-

Alright, so some fruitless poking and tests made us realize what was going on. So at the time the site’s homepage and url was https://corlesss.github.io/site links were supposed go to https://corlesss.github.io/sites/<page_name>. However, instead they were going to https://corlesss.github.io/<page_name>.

So remember how we said “learn how Github pages work?” So turns out that Hugo/this Hugo Theme expected to have the root be https://corlesss.github.io (kinda, will get back to later) so I needed to figure out how to get to that point!

Without all the hair pulling that our sleep deprived brain did, turns out you just need to name the repo <yourusername>.github.io. That was easy enough to do. And *boom* the site worked.

…still didn’t apply my customizations to the theme. -_-

So! Looked at the Github action to see if there was something weird with how Github compiled the site! So turns out when it compiles, it automatically downloads the newest version of the theme. And the customizations we made were done directly in the theme’s own folder; which wasn’t being uploaded since it was a git submodule.

So, if I can’t upload the customizations there, then how could I apply these customizations to the site… Then I realized, that the theme’s directory layout was nearly identical to the root of the repo! Which meant that if I copied the theme’s layout folder to the one in the root, then the customizations would be uploaded to Github and override the default theme!

And somehow this leap in logic actually worked, and it worked exactly how we assumed!

And now the site worked, and it looked almost exactly as how we assumed!

After this point was writing some content, and doing more CSS tinkering especially for dark mode since we kinda forgot to configure that before getting the site to work… 😅

So with this knowledge, we’ll probably make a tutorial for how to make a personal site using hugo and github pages soon! ^-^