Example Hugo website using GitLab Pages.
Learn more about GitLab Pages at the official documentation.
Deprecation of container registry
As of 2025-01-16 (MR), this project relies on the Docker image of https://docker.hugomods.com.
The last version of Hugo uploaded in the
container registry
is 0.140.2. You're advised to replace registry.gitlab.com/pages/hugo/hugo_extended:latest
with hugomods/hugo:exts.
- GitLab CI/CD
- Set
baseURLinconfig.toml - Building locally
- Use a custom theme
hugovshugo_extended- GitLab User or Group Pages
- Did you fork this project?
- Troubleshooting
GitLab CI/CD
This project's static Pages are built by GitLab CI/CD,
following the steps defined in .gitlab-ci.yml.
Set baseURL in config.toml
Update the baseURL setting in your config.toml file from "https://pages.gitlab.io/hugo/" to your deployed Pages URL.
Building locally
To work locally with this project, you'll have to follow the steps below:
-
Fork, clone or download this project.
-
Install Hugo.
-
Install the theme as a Hugo module:
hugo mod get -u github.com/adityatelange/hugo-PaperMod -
Preview your project:
hugo server -
Add content.
-
Optional. Generate the website:
hugo
Read more at Hugo's documentation and how to use the theme.
Use a custom theme
Hugo supports a variety of themes.
Visit https://themes.gohugo.io/ and pick the theme you want to use. In the Pages example, we use https://themes.gohugo.io/themes/hugo-papermod/.
Use a custom theme using a Hugo module
The example .gitlab-ci.yml uses Hugo modules to import the theme.
To use your own theme, the following steps will help you recreate the hugo modules that include the information of your theme. You must perform them locally:
-
Edit
config.tomland comment out the already existing theme:#theme = ["github.com/adityatelange/hugo-PaperMod"] -
Remove
go.modandgo.sum:rm -f go.mod go.sum -
Recreate the theme module:
hugo mod init gitlab.com/pages/hugo -
Recreate the checksum:
hugo mod get -u github.com/adityatelange/hugo-PaperMod -
Edit
config.tomland add the theme back:theme = ["github.com/adityatelange/hugo-PaperMod"] -
Finally, edit
.gitlab-ci.yml, and replace theTHEME_URLvariable with the URL of your theme:THEME_URL: "github.com/adityatelange/hugo-PaperMod" -
Remove the files under
content/as they might be specific to the default theme. -
Add content under
content/. -
Commit all the changes and push them to your repository.
hugo vs hugo_extended
NOTE:
As of 2025-01-16, this project relies on the Docker image of https://docker.hugomods.com.
The last version of Hugo uploaded in the
container registry
is 0.140.2. You're advised to replace registry.gitlab.com/pages/hugo/hugo_extended:latest
with hugomods/hugo:exts.
The container registry
contains two kinds of Hugo Docker images, hugo and
hugo_extended. Their main difference is that hugo_extended comes with
Sass/SCSS support. If you don't know if your theme supports it, it's safe to
use hugo_extended since it's a superset of hugo.
The Container Registry contains three repositories:
registry.gitlab.com/pages/hugoregistry.gitlab.com/pages/hugo/hugoregistry.gitlab.com/pages/hugo/hugo_extended
pages/hugo:<version> and pages/hugo/hugo:<version> are effectively the same.
hugo_extended was created afterwards, so we had to create the pages/hugo/ namespace.
See how the images are built and deployed.
GitLab User or Group Pages
To use this project as your user/group website, you will need to perform some additional steps:
-
Rename your repository to
namespace.gitlab.io, wherenamespaceis yourusernameorgroupname. - Change the
baseURLsetting in yourconfig.toml, from"https://pages.gitlab.io/hugo/"tobaseURL = "https://namespace.gitlab.io". Proceed equally if you are using a custom domain:baseURL = "https://example.com".
Read more about GitLab Pages for projects and user/group websites.
Did you fork this project?
If you forked this project for your own use, please go to your project's Settings and remove the forking relationship, which won't be necessary unless you want to contribute back to the upstream project.
Troubleshooting
CSS is missing!
That means two things:
- Either that you have wrongly set up the CSS URL in your templates.
- Or the
baseURLinconfig.tomlis not corretly set. For more information see issue https://gitlab.com/pages/hugo/-/issues/18.
Minify the assets
If you want to minify the assets (JS, CSS, images, etc.), take a look at the Hugo documentation and at this merge request.
Personal projects
View all- Loading
About
Free and Open Source Enthusiast.