Hosting Hugo on Github Pages with a Custom Domain Name

Once you’ve setup Hugo locally, the next step is hosting your website for the whole world to see. If you wanted you could host Hugo on AWS, Google Cloud Engine, Azure, Digital Ocean, or any other place where servers are hosted. Since Github Pages allows you to host static websites for free and Github is the most popular version control tool available, Github Pages seems like a good bet for hosting a website. Here’s Hugo’s instructions on setting up Hugo with Github Pages.

  1. Set up an empty github repo named <USERNAME>.github.io.
  2. From the top level directory of your Hugo project, remove the public directory (if it exists) with rm -rf directory.
  3. Ceate a git submodule to push the public website to your <USERNAME>.github.io repository with git submodule add -b master git@github.com:<USERNAME>/<USERNAME>.github.io.git public.
  4. Create a shell script deploy.sh with the below contents to deploy everything automatically. And, don’t forget to make the script executable with chmod +x deploy.sh.
  5. Run deploy.sh "first commit" and check out your website at https://username.github.io/
#!/bin/bash

echo -e "\033[0;32mDeploying updates to GitHub...\033[0m"

# Build the project.
hugo # if using a theme, replace with `hugo -t <YOURTHEME>`

# Go To Public folder
cd public
# Add changes to git.
git add .

# Commit changes.
msg="rebuilding site `date`"
if [ $# -eq 1 ]
  then msg="$1"
fi
git commit -m "$msg"

# Push source and build repos.
git push origin master

# Come Back up to the Project Root
cd ..

If you want to add a custom URL rather than the standard username.github.io, then you will need to register a domain name with a DNS provider. You can do this with any DNS provider. Once you’ve registered your custom domain name, you simply have to provide Github’s addresses to the DNS provider as A records, which Github specifies here.

Now, you should have an easy to use platform to share stuff with the world organized with Hugo and hosted with Github Pages