Skip to content

Hugo

Hugo🔗

Installation

1
sudo snap install hugo

Documentation

Configuration🔗

Taxonomies, Categories and Tags🔗

Keep taxonomy case

1
preserveTaxonomyNames = true

Themes🔗

Name Links Description
Book GitHub Demo Simple and clean documentation style sites
Clarity GitHub Demo A technology-minded theme for Hugo based on VMware’s open-source Clarity Design System featuring rich code support, dark/light mode, mobile support, and much more
DocuAPI GitHub Demo DocuAPI is a beautiful multilingual API documentation theme for Hugo. This theme is built on top of the beautiful work of Robert Lord and others on the Slate project (Apache 2 License). The JS part has recently been rewritten from Jquery to AlpineJS.
Doks Website Modern Documentation Theme
Hugoplate GH free starter template built with Hugo and TailwindCSS that will save you hours of work
LoveIt GitHub clean, elegant but advanced blog theme
Stack GitHub Demo Card-style blog, dark mode (switchable), tags, archives

Clarity🔗

My fork

Extensions and Add-ons🔗

Writing Pages🔗

Layout🔗

Pages🔗

Page Resources🔗

Page bundles

Page Bundles are a way to group Page Resources.
A Page Bundle can be one of:

  • Leaf Bundle (leaf means it has no children)
  • Branch Bundle (home page, section, taxonomy terms, taxonomy list)

Templates and Partials🔗

resize image 
1
2
3
4
5
6
{{ range (where .Pages “Section” “gallery”) }}
  {{ range .Resources.ByType "image" }}
    {{ $resized_image := .Resize "400x" }}
    <img src="{{ $resized_image.RelPermalink }}" />
  {{ end }}
{{ end }}

Hosting and Deployment🔗

GitHub Pages🔗

https://gohugo.io/hosting-and-deployment/hosting-on-github/

Examples🔗

References🔗