1. How to set up a HUGO website

1. How to set up a HUGO website

Absolutely! Here’s a refactored, more polished version of your draft. I’ve focused on making the article flow smoothly, keeping it engaging and easy to follow, while preserving your personal voice and practical insights.


How to Set Up a Hugo Website on Linux

Setting up a Hugo website on Linux is refreshingly straightforward—once you know which version to use and how to install it properly. In this guide, I’ll walk you through the process step by step, sharing a few lessons I learned along the way so you can avoid common pitfalls.


1. Getting Started: The Official Guide

My journey began with the official Hugo Quick Start guide. The first step is, of course, installing Hugo. If you’re on Linux (like me), pay close attention to which version you install—this can save you some headaches later.


2. Choosing the Right Hugo Version

Hugo comes in three main flavors:

  • Standard: The basic version. No SCSS/SASS support or advanced asset processing. Use this only if your theme uses plain CSS.
  • Extended: Everything in Standard, plus support for SCSS/SASS and advanced asset processing (Hugo Pipes). This is the recommended version for most themes.
  • Extended/Deploy: Same as Extended, but with the hugo deploy command for direct deployment to cloud providers (AWS S3, Google Cloud Storage, Azure). You won’t need this if you’re deploying to GitHub Pages or Cloudflare Pages.

Which version should you choose?

  • Using a theme? → Hugo Extended
  • Deploying to AWS, Google, or Azure? → Hugo Extended/Deploy
  • Deploying to GitHub Pages or Cloudflare Pages? → Hugo Extended is perfect.

Here’s a quick comparison:

Version SCSS/SASS Support Built-in Deploy Good for GitHub Pages?
Standard No No Yes
Extended Yes No Yes (recommended)
Extended/Deploy Yes Yes (cloud only) Yes

Since I planned to host my site on GitHub Pages (or Cloudflare Pages), I went with Hugo Extended.


3. Prerequisites: What You Need Before Installing Hugo

Before installing Hugo, make sure you have the following tools:

  • Git
  • Go

Check if they’re installed:

git --version
go --version

If you need to install Go:

sudo apt install golang-go

Do You Need to Install Dart Sass Separately?

Nope! Hugo Extended comes with a built-in Dart Sass compiler. You only need to install Dart Sass separately if:

  • You’re using the Standard version (which doesn’t support SCSS/SASS anyway), or
  • You need Dart Sass for other, non-Hugo projects.

In summary:

  • ✅ Install Hugo Extended (not Standard)
  • ✅ No need to install Dart Sass separately for Hugo Extended
  • ✅ SCSS/SASS works out of the box with Hugo Extended

At this point, my setup looked like this:

  • Git v2.43.0
  • Go 1.22.2 linux/amd64

4. Installing Hugo: The Easy Way (and Its Drawbacks)

I first tried the straightforward approach:

sudo apt install hugo

This worked, but there was a catch: the version available in the Ubuntu/Mint repositories was outdated. For the latest features and best theme compatibility, you’ll want the most recent Hugo Extended release.


5. Upgrading to the Latest Hugo Extended

Here’s how I got the latest version up and running:

  1. Remove the old Hugo (optional, but recommended):

    sudo apt remove hugo
  2. Download the latest Hugo Extended release:

    • Visit the official Hugo releases page and look for the latest hugo_extended_X.Y.Z_Linux-64bit.tar.gz.

    • Or, from the terminal (replace 0.128.1 with the latest version):

      cd /tmp
      wget https://github.com/gohugoio/hugo/releases/download/v0.128.1/hugo_extended_0.128.1_Linux-64bit.tar.gz
  3. Extract and install:

    tar -xzf hugo_extended_0.128.1_Linux-64bit.tar.gz
    sudo mv hugo /usr/bin/
  4. Verify your installation:

    hugo version

    You should see something like:

    hugo v0.128.1+extended ...

6. Creating Your New Site and Choosing a Theme

With Hugo Extended installed, I returned to the Quick Start guide. The next steps were:

  1. Create a new site:

    hugo new site quickstart
    cd quickstart
    git init
  2. Pick a theme:
    The guide suggests the Ananke theme, but I wanted something different. After browsing Hugo Themes, I chose Hugo Book.

  3. Add the theme as a submodule:

    git submodule add https://github.com/alex-shpak/hugo-book themes/hugo-book
  4. Set the theme in your config:

    echo "theme = 'hugo-book'" >> hugo.toml

7. Running the Local Server (and a Common Gotcha)

With everything set up, I tried to start the local server:

hugo server

But I hit a snag: I realized I had accidentally installed the Standard version of Hugo, which doesn’t support SCSS/SASS (required by many themes, including Hugo Book). To fix this, I downloaded the correct Extended version:

cd /tmp
wget https://github.com/gohugoio/hugo/releases/download/v0.148.2/hugo_extended_0.148.2_Linux-64bit.tar.gz
tar -xzf hugo_extended_0.148.2_Linux-64bit.tar.gz
sudo mv hugo /usr/bin/

After replacing the binary, I ran hugo server again. This time, the local server started successfully at localhost:1313.


8. Adding Your First Content (and a Few Theme-Specific Quirks)

Following the Quick Start guide, I created my first post:

hugo new content content/posts/my-first-post.md
nano content/posts/my-first-post.md

The generated file looked like this:

---
title: "My First Post"
date: 2025-08-03T21:09:37+02:00
# bookComments: false
# bookSearchExclude: false
---

However, the Quick Start guide shows a slightly different format:

+++
title = 'My First Post'
date = 2024-01-14T07:07:07+01:00
draft = true
+++

I realized the difference was due to my choice of theme—front matter formats and available properties can vary. I added some draft content to my file:

---
title: "My First Post"
date: 2025-08-03T21:09:37+02:00
# bookComments: false
# bookSearchExclude: false
---
## Introduction

This is **bold** text, and this is *emphasized* text.

Visit the __MARKDOWN_LINK_5__ website!

To preview draft posts, I ran:

hugo server --buildDrafts
# Or simply: hugo server -D

At first, nothing appeared on my page. I thought I needed to add draft = true to my file, but that didn’t work—turns out, with the Book theme, the correct syntax is draft: true (YAML, not TOML), and sometimes you don’t need it at all if your theme handles drafts differently. I had to dig into the Book theme’s documentation to clarify this.


9. Configuring Your Site

Next, the Quick Start guide prompted me to update my site configuration in hugo.toml. I set my production URL to https://jacoblindqvist.com/ and changed the page title. Most theme authors provide their own configuration guidelines and options, so it’s worth reading through your chosen theme’s documentation to make sure everything is set up correctly.


10. Moving, Initializing Git, and Pushing to GitHub

Once I was happy with my local setup, I moved my project to a more permanent location:

mv ./quickstart ./jacoblindqvist

Then, I created a new private repository on GitHub called website with the description “My personal HUGO website”.

To connect my local project to GitHub, I installed the GitHub CLI and authenticated:

sudo apt install gh
gh auth login

After logging in, I pushed my code:

git add .
git commit -m "Initial Commit"
git branch -M main
git remote add origin https://github.com/jacoblindqvist/website.git
git push -u origin main

And just like that, my code was live on GitHub.


11. Deploying to Netlify

With the code on GitHub, it was time to get the site online. I chose Netlify for hosting.

  1. Sign up for a Netlify account and go to “Projects”.
  2. Click “Import from Git” and select GitHub as the source.
  3. Authorize Netlify to access your GitHub repositories.
  4. Find and select your website repo.
  5. Set the project name (I used jacoblindqvist), leave the Base Directory empty, set the build command to hugo (default), and the publish directory to public.
  6. Click “Deploy”.

Troubleshooting: Hugo Command Not Found

My first deploy failed because Netlify couldn’t find the hugo command. To fix this, I added a netlify.toml file to my project root:

[build]
  publish = "public"
  command = "hugo"

[build.environment]
  HUGO_VERSION = "0.148.2"  # or whatever version you're using

Then I committed and pushed the change:

git add netlify.toml
git commit -m "Add Netlify config with Hugo version"
git push

After a moment, the build succeeded. Visiting https://jacoblindqvist.netlify.app/ confirmed my site was live!

Continued

Okay, so I decided I wanted a different theme. So now I have to remove the other theme.

I removed the theme refrence in hugo.toml and added

[module]
    [[module.imports]]
        path = "github.com/colinwilson/lotusdocs"
        disable = false
    [[module.imports]]
        path = "github.com/gohugoio/hugo-mod-bootstrap-scss/v5"
        disable = false

as stated in the lotus docs documentation.

I removed the old files in themes, assets and layouts.

then ran hugo server -D.

In the browser I had to do ctrl shift R to force refresh. Woptiloop, there we are, new theme. Perfect.

Then we run

git add . 
git commit -m "Changed to lotusdocs theme"
git push

You obviously shouldnt push to Main all the time but I am just figuring stuff out so thats what we do. But on the other hand, i dont really care, there are people out there running successful apps and they do live coding without git. So if anything goes wrong, well, yeah, pain in ass.

Now I am moving on to writing a Go daemon that will monitor my obsidian vault and push published notes to my website.