Hugo Template System Explained

Hugo Template Basics

Hugo uses Go’s text/template and html/template libraries as its template engine.

Basic Syntax

{{ .Title }}
{{ .Content }}
{{ range .Pages }}
  <h2>{{ .Title }}</h2>
{{ end }}

Template Types

1. baseof.html - Base template
2. list.html - List page template
3. single.html - Single page template
4. partials/ - Reusable components

Conditionals

{{ if .Params.featured }}
  <span class="badge">Featured</span>
{{ end }}

Loops

{{ range .Site.RegularPages }}
  <article>{{ .Title }}</article>
{{ end }}