Hugo

Hugo Page and URL References

A comparison of .BaseURL, .page, .Permalink, .RelPermlink, etc.

How to Create a Recommended Reading Function

How to display a list of data items based on matching taxonomy terms. The technique is similar to a “Related Posts” function, but here we create a collection of data records instead of content pages.

Ron

How to Use Range, Where and Sort in Hugo

Hugo SSG

Go-Templates

Various combinations of using range, where, first, sort, uniq, union, intersect, etc. in Hugo and Go Templates. Many are based on the Hugo Docs, but collected here in one place for easier access.

Syntax

Sort in Ascending or Descending Order

{{ sort site.Params.grades }} <!-- "value" "asc"  is optional for ascending -->
{{ sort site.Params.grades "value" "asc" }}
{{ sort site.Params.grades "value" "desc" }}

Sort a Map in Ascending or Descending Order

{{ range sort site.Params.authors "firstname" }}
  {{ .firstName }}
{{ end }}

{{ range sort site.Params.authors "firstname" "asc" }}
  {{ .firstName }}
{{ end }}

{{ range sort site.Params.authors "firstname" "desc" }}
  {{ .firstName }}
{{ end }}

Range with Where

{{ range where .Data.Pages "Section" "post" }}
	{{ .Content }}
{{ end }}

Range and Where with Intersect

{{ range where .Site.Pages ".Params.tags" "intersect" .Params.tags }}
{{ if ne .Permalink $.Permalink }}
	{{ .Render "summary" }}
{{ end }}
{{ end }}

Create collection of Pages using Variables, Type, Union, and Intersect

Find regular pages excluding .Type “page” or “about”,
unless they are pinned,
excluding all pages with no images set in the Page parameter “images”.

{{ $pages := where .Site.RegularPages "Type" "not in" (slice "page" "about") }}
{{ $pages := $pages | union (where .Site.RegularPages "Params.pinned" true) }}
{{ $pages := $pages | intersect (where .Site.RegularPages "Params.images" "!=" nil) }}

Range, Where and Intersect with Variables

{{ $var1 := where .Site.Pages "Params.a" "var1" }}
{{ $var2 := where .Site.Pages "Params.b" "var2" }}
{{ $filtered := $var1 | intersect $var2 }}
{{ range $filtered }}
{{ end }}

Range through data with Where and Sort

range through data files and grab the first 5,
where the data directory matches [directory], and
sort by the data field [date] in descending order.

{{ range first 5 ((where .Site.Data.[directory] "[data_field]" "eq" .Params.[name]) sort .Site.Data.[directory] "date" "desc") }}

Range with Multiple Where Clauses

Find all pages where the section name matches [section_name].
In that set, find all pages where the param [param_name] equals “true”.

{{ range where (where .Data.Pages "Section" "[section_name]" ) ".Params.param_name" "eq" "true" }}

Range Through a Map, Filtering on a Field, and Removing Duplicates

range through the map $result,
collect only unique items (eliminate duplicates).
find the first 10,
where the description field is not missing or empty.

{{ range first 10 (where ($result | uniq) ".description" "gt" "") -}}

range through all RegularPages (real content pages, not .Section, _index.md, etc.),
where the param topics matches the current page’s param,
but don’t include the current page.

{{ $posts := where (where .Site.RegularPages ".Params.topics" "intersect" .Params.topics) "Permalink" "!=" .Permalink -}}
{{- with $posts -}}
    <hr>
    <div class="no-print">
        <h4>Related Content</h4>
        <ul>
            {{ range first 8 . -}}
                <li class="relatedPost"> <a href="{{ .RelPermalink }}">{{ .Title | title }}</a></li>
            {{- end }}
        </ul>
    </div>
{{- end }}

Ron

Am I Viewing Localhost?

Localhost

Hugo SSG

When working locally, it’s easy to get confused while switching quickly between development and production views of your site. All that’s really needed is a glance at the URL, but errors slip in when you think you’re looking at the development version, and don’t notice that you’re not.

In Hugo, one quick way to avoid the mixup is to add alternate css for the builtin local development server. This is easy to do because Hugo sets the builtin variable hugo.IsServer to “true” whenever the site is served by the builtin development server.

Ron

Default Taxonomy Template in Hugo

Taxonomies

Hugo

How to create a default taxonomy template in Hugo.

Ron

Using Scratch to Increment a Counter in a Range

Hugo SSG

Scratch was originally added to Hugo to get around a limitation of Go templates. Due to advances in Go Templates, Scratch is no longer needed in most situations, but it still works.

Ron

Html5 Charts in Hugo

Javascript

Design

Hugo

Thanks to the good work of Shen Yu and a global community of hackers, it is now easy to add fancy charts to Hugo Websites. Here are my first experiments.

Ron

Html5 Charts in Hugo

Javascript

Design

Hugo SSG

Thanks to the good work of Shen Yu and a global community of hackers, it is now easy to add fancy charts to Hugo Websites. Here are my first experiments.

Ron