Hugo (Cheat Sheet)

Install Hugo

With Homebrew:

brew install hugo


Create post

hugo new posts/<>

Clone Hugo website on new device

Install Hugo: brew install hugo.

Clone repo and submodules (e.g. themes):

git clone --recurse-submodules <repo>

Fetch and merge updates in submodule:

git submodule update --remote

Source: Git docs - 7.11 Git Tools - Submodules

Build and host locally hugo server -D

Visualise Hugo in VS Code

  1. In your terminal type hugo server -D
  2. Copy the localhost address e.g. http://localhost:1313/
  3. Open the command pallete (Ctrl + Shift + P)
  4. Select “Simple Browser: Show”
  5. Enter URL/web address (e.g. http://localhost:1313/)
  6. Press Enter

Source: Stack Overflow

Exclude some files

In config.yml, to exclude specific files from the content and data directories when rendering your site, set ignoreFiles to one or more regular expressions to match against the absolute file path.

To ignore files ending with .foo or .boo:

- \.foo$
- \.boo$

To ignore a file using the absolute file path:

- ^/home/user/project/content/test\.md$

Source: - Ignore Content and Data Files when Rendering

Modify syntax highlighting

Instructions copied from PaperMod/FAQs/Using Hugo’s Syntax highlighter “chroma” .

  1. Disable Highlight.js in site config.yml

            disableHLJS: true
  2. Set hugo’s markdown styling in site config.yml

    Find styles here: Chrome Style Gallery

            # anchorLineNos: true
            codeFences: true
            guessSyntax: true
            lineNos: true
            # noClasses: false
            style: monokai
  3. If you want lineNos: true, the background won’t be proper. This will only work with noClasses: false or pygmentsUseClasses: true. Read Generate Syntax Highlighter CSS

    Add the following to assets/css/extended/custom.css

    .chroma {
        background-color: unset;

    More Info : Configure Markup - Highlight

“Official” config from Hugo docs (for comparison):

    anchorLineNos: false
    codeFences: true
    guessSyntax: false
    hl_Lines: ""
    lineAnchors: ""
    lineNoStart: 1
    lineNos: false
    lineNumbersInTable: true
    noClasses: true
    noHl: false
    style: monokai
    tabWidth: 4

Social icons

See here: