Setting Up My Website Using Hugo

Fri, 01 May 2026 20:31:20 +0200

Intended workflow

create/modify a post locally -> build and publish with ‘hugo’ -> git commit and publish to remote -> GitLab repo main branch gets updated -> Cloudflare Pages triggers a rebuild -> web pages of the blog get updated.

Steps, Difficulties and Solutions

download hugo using snap
create a git repo in the blog directory
create a GitLab access token. Define my GitLab repo as a remote for the blog git repo. Git push to the remote. Use the GitLab access token when asked to authenticate - not the GitLab account credentials!
by default the main branch on GitLab is protected. For the initial ‘git push remote origin main’, I deactivated the protection feature in GitLab under Settings -> Repository -> Protected branches -> main.
to create blog posts, I placed them under ‘content/posts’. I placed images under ‘static/images’. I insert an image in a blog post using this syntax:
integrate mit GitLab repo with Cloudflare Pages. I spent much time troubleshooting this. I confused Cloudflare Workers with Cloudflare Pages. I should have chosen the right config option. Firefox does not display the Cloudflare dashboard correctly. Use Chrome instead.
create a custom domain in Cloudflare Pages. Associate my domain name with the Cloudflare Page.
verify local rendering of the draft blog using ‘hugo server –buildDrafts’
once the blog post is ready for publishing, set the parameter ‘draft’ to ‘false’, execute ‘hugo’, git push origin {branch_name}, create a merge request on GitLab and accept it. Cloudflare Pages will automatically rebuild the code. Reload the website to see the changes.

Topologies I will practice inshAllah

Default on Aouadi's Files

Setting Up My Website Using Hugo

Intended workflow

Steps, Difficulties and Solutions

Topologies I will practice inshAllah