April 4, 2024

Deployng Your Hugo Site to GitHub Pages

GitHub pages can be quite useful when it comes to hosting for free. It perticularly makes more sense when you have a domain and just want to host your static site i.e. a Hugo site.

In this blog, we will be going through a step-by-step guide on how you can setup your Hugo static site with GitHub pages.

Prerequisite

This guide assumes that:

  • You already have a hugo site set up
  • You already have an account on GitHub

Setup

There are two different ways you can do this depending on if you have a domain or not. If you don’t have a domain, your website will be available on a GitHub link so you don’t need to worry.

No domain

Once you have pushed your website to a GitHub repository:

  • Go to your repository
  • Make sure that your repository ends with “.github.io” For example, website.github.io
  • Go to Settings > Pages
  • Select a branch under Branch
  • Click on Save
  • Once done, wait for a few minutes and your website will be deployed.
  • The GitHub will be displayed at the start of the page.

Note: GitHub may take 10-15 minutes before generating the webpage properly on the domain.

With a domain

  • Go to your repository
  • Go to Seetings > Pages
  • Select a branch under Branch
  • CLick on Save
  • add your domain under Domain and click on save
  • Wait for a few minutes and your website should be live!

and there you go. Deploying a Hugo website on GitHub pages is a straightforward process that offers a powerful and reliable platform for hosting your static site while also keep version control.

Experiment with different themes, customise your content and showcase your work to the world with GitHub pages and Hugo.

-Happy coding!

LET’S WORK TOGETHER