Create post
hugo new posts/<file.md>
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
- In your terminal type
hugo server -D
- Copy the localhost address e.g.
http://localhost:1313/
- Open the command pallete (
Ctrl
+Shift
+P
) - Select “Simple Browser: Show”
- Enter URL/web address (e.g.
http://localhost:1313/
) - 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
:
ignoreFiles:
- \.foo$
- \.boo$
To ignore a file using the absolute file path:
ignoreFiles:
- ^/home/user/project/content/test\.md$
Source: gohugo.io - Ignore Content and Data Files when Rendering
Modify syntax highlighting
Instructions copied from PaperMod/FAQs/Using Hugo’s Syntax highlighter “chroma”.
Disable Highlight.js in site
config.yml
params: assets: disableHLJS: true
Set hugo’s markdown styling in site
config.yml
Find styles here: Chrome Style Gallery
markup: highlight: # anchorLineNos: true codeFences: true guessSyntax: true lineNos: true # noClasses: false style: monokai
If you want
lineNos: true
, the background won’t be proper. This will only work withnoClasses: false
orpygmentsUseClasses: true
. Read Generate Syntax Highlighter CSSAdd the following to
assets/css/extended/custom.css
.chroma { background-color: unset; }
More Info : Configure Markup - Highlight
“Official” config from Hugo docs (for comparison):
markup:
highlight:
anchorLineNos: false
codeFences: true
guessSyntax: false
hl_Lines: ""
lineAnchors: ""
lineNoStart: 1
lineNos: false
lineNumbersInTable: true
noClasses: true
noHl: false
style: monokai
tabWidth: 4