Blog server setup with Hugo + GitLab Pages

Learn how to set up a blog server using Hugo + GitLab Pages. It's free.

Goal

Below is a configuration diagram (example) of a blogging environment with Hugo + GitLab Pages. The goal here is to create a Hugo content repository (including themes and CI/CD container definitions) and a directory to be published as a website in GitLab, manually launch the container, and build/publish the sample website.

Assumption

I will assume that you have a Free GitLab account with GitLab SaaS available.

Procedure

Create a directory in GitLab that will be published as a Hugo content repository and website

1. log in to GitLab with a browser.

2. Press New project button.

3. Press Create from template button.

4. Press Use template in Pages/Hugo record.

5. Enter Project name, select Visibility Level, and press Create project button to create a project containing a Hugo content repository and a directory to be published as a website.

Build and publish a sample site with Hugo's CI/CD container

1. Open CI/CD-Pipelines screen of the project.

2. Press Run pipeline button.

3. Press Run pipeline button again, and the build will be completed in about 30s to 60s.

4. Open Settings-Pages of the project.

5. Open the URL indicated by Your pages are served under: to see a sample site that has been built.

Caution
: As of January 2025, some errors occur in step 3 and the build fails. Please apply a another theme.