Learning Hugo

# Mar 31, 2021

Essential Commands

// To start a project
hugo new site first_site
// To run server -D to show drafts
hugo server -D
// To create a post dirname optional
hugo new dirname/post_name.md

Add a theme to config.toml

    theme = "theme-name"

Content Organization

// Create this to make /dir1/dir2
// accessible
hugo new dir1/dir2/_index.md

Archetypes

You can change the archetypes to change the front matter defaults. Like dir1.md. If directroy exists, it will be used.

Shortcodes

You can add shortcodes to content.

\{\{\< shortcode-name param \>\}\}
// Example
\{ \{<youtube 2xkNJL4gJ9E>\}\}

Taxonomies

Adding keywords, tags, categories Add taxonomies to the front matter.

tags: ["tag1", "tag2", "tag3"]
categories: ["cat1", "cat2"]

Custom Taxonomy

// Add to config.toml
// If you define taxonomies, you
// Should define tag and cat too
[taxonomies]
	tag = "tag"
	category = "categories"
	mood = "moods"

Templates (Layouts)

Two main types of content. List and Single Page. You can override theme layouts. Create folder _default in layouts. You can add index.html for homepage. You can create folder dir1 to be used in the section. You can create baseof.html in _default to make a parent template.

//baseof.html
...
<body>
	{{block "main" . }}
		Can write default here.
	{{end}}
</body>
...
// Use in single.html etc.
{{define "main"}}
	This is the bla bla
{{end}}

Partial Headers

{{ partial "header" . }}
// Can also pass a dictionary
{{ partial "header" (dict "abc" "alphabet") }}

Variables

{{ .Title }}
{{ .Date}}
{{ .URL}}
// You can also create custom
// Variables in YAML
myVar: "blabla
{{ .Params.myVar }}
// Can create new variables as such
{{ $varName := "string" }}
{{ $varName }}

Functions

{{ truncate 10 " This is a very
 long string" }}
{{ add 1 5 }}
... sub
... singularize

{{ range .Pages }}
	// Loop
	{{ .Title }}
{{ end }}

If

{{ if }}
eq
lt
le
gt
ge
not
and
or

{{ if not (eq $var1 $var2) }}
{{ else }}
{{ end}}

Yusuf Avcı