Creating a menu for all Nested Sections within a Section

tips & tricks
1

Spent a bit of time on this. After reading quite a few topics, checking out the demo at bepsays.com and trying out several things.

This is by far the simplest way to create a Nested Sections menu without the regular pages permalinks.

{{ range .Sections }}
<a href="{{ .Permalink }}">{{ .Title | upper }}</a>
{{end}}

If you have an even better way of doing this please share.

EDIT
The above menu renders only on the Main Section list and not on the Nested Sections list pages.

Now here is how to make a Nested Sections Menu appear everywhere within a Section.

{{ range (.Site.GetPage "section" .Section).Sections  }}
<li><a href="{{ .Permalink }}">{{ .Title | upper }}</a></li>
{{end}}

Thanks to @budparr for this

EDIT

The above stopped working in Hugo 0.45 after the revision of the .GetPage API.

But with the help of @kaushalmodi in Panic Error with .GetPage in Hugo 0.45 - #2 by kaushalmodi here is the revised code snippet to have this functionality in Hugo 0.45.

{{ with .Site.GetPage (printf "/%s" .Section) }} 
{{ $sections := .Sections }}
{{ range where $sections }}
<li><a href="{{ .Permalink }}">{{ .Title }}</a></li>
{{ end }}
{{end}}
3 Likes
2

I had to search for this one and the thought didn’t occur to me to look up the word “Section” when I want to display the title of a folder until I started to try and build my own theme.

Below is the index.html file. It displays the available sections or folders accessible from the home page.

Capture
Capture.JPG1194Ă—782 47.1 KB

Here is a list.html template file. It lists the section/folder titles in a section.

Capture2
Capture2.JPG1157Ă—438 38.3 KB

Reiterations

  • To display content on your home level _index.md file, you need to include {{ .Content }} in your index.html file.
  • To display the content on your sub level _index.md files, you need to includ {{ .Content }} in your list.hml files.
  • By design: the above ONLY displays the section titles. It does NOT display nested sections.
1 Like