Hello, I’m trying to make a list of sections that are available for users to navigate into. My thinking is to treat them like categories. I tried this code:
{{ range .Site.Sections }}
<li><a href="/{{ . }}">{{ . }}</a></li>
{{ end }}
This was the resulting output:
<li><a href="/[%7b0%20%7d]">[{0 }]</a></li>
How do I get the name of the section for output?
I think a better approach is to use the [variables][2] like .Permalink to make it explicit what you’re trying to do instead of the ..
{{ range .Site.Sections }}
<li><a href="{{ .Permalink }}">{{ .Title }}</a></li>
{{ end }}
With .Type I thought (see variables page).
[1]: Functions | Hugo
[2]: Variables | Hugo
Jura - I tried that but it didn’t work. I get the following errors:
ERROR: 2015/08/24 template: theme/partials/footer.html:16:27: executing “theme/partials/footer.html” at <.Permalink>: can’t evaluate field Permalink in type hugolib.WeightedPages in theme/partials/footer.html
ERROR: 2015/08/24 template: theme/partials/footer.html:16:27: executing “theme/partials/footer.html” at <.Type>: can’t evaluate field Type in type hugolib.WeightedPages in theme/partials/footer.html
Just to make sure we are on the same page, I am trying to list out all sub directories of /content. Not all sections that a page is a part of.
I’ve figured it out. I needed to turn on “SectionPagesMenu”. I did not expect to find the answer there.
I tried the same but the docs regarding .Site.Sections are a bit confusing. The variable is defined as:
.Site.Sections Top level directories of the site.
So, after knowing this I wanted to print them out:
{{ range .Site.Sections }}
<a href="#">{{ . }}</a>
{{ end }}
And my used dummy folder structure:
content
├── about
│ ├── foobar.md
│ ├── privacy.md
│ └── showcase.md
└── api
└── features.md
The final output is disapointing:
[{0 } {0 } {0 }]
[{0 }]
Instead of showing the section’s name I get an array with weird items for each sections whose length matches the number of files in that section.
Can somebody spot my error?
Disappointing?
The section list is of type Taxonomy. You don’t have to guess – this is all documented:
Is there a reason why this variable has the type Taxonomy? I would interpret the documentation’s definition of .Site.Sections
.Site.Sections Top level directories of the site.
as all direct sub-directories of content, e.g. in content/post/ the section would be post. And that’s also the way how you explained them:
Section is the first folder under content (content/blog => blog)
However, I found a slightly hacky workaround in order to list all sections and the files that are stored in a section. Here’s my script if somebody finds it useful:
<!-- Find all top-level subfolders in content (e.g. content/post/) -->
{{ range .Site.Menus.main }}
<!-- Get the section name -->
{{ $section := index (split .URL "/") 1 }}
<!-- If the section isn't found yet add him with a delimiter-->
{{ if (not (in (split ($.Scratch.Get "sections") "|" ) $section)) }}
{{ $.Scratch.Add "sections" $section }}
{{ $.Scratch.Add "sections" "|" }}
{{ end }}
{{ end }}
<ul>
{{ $allSections := (split ($.Scratch.Get "sections") "|") }}
<!-- Now $allSections contains all sections. But the splitting caused that the last index is an empty string (or a non-valid section). Let's ignore this index by correcting the number of indexes. -->
{{ $numOfSections := sub (len $allSections) 1 }}
{{ range first $numOfSections $allSections }}
<li> <b>Section "{{ . }}" contais:</b>
<!-- Find all pages in the current section -->
{{ range where $.Site.Pages "Section" . }}
<li>{{ .Title }}</li>
{{ end }}
</li>
{{ end }}
</ul>
This only works if the sections don’t contain nested subfolders!
/content/section/foobar.md # is valid
/content/section/subsection/foobar.md # is NOT valid
Because a section kind of is a special kind of taxonomy? Why does it matter what the name of the type is?
It just confused me what .Site.Sections returned and what I falsely expected. But you already explained it in the first sentence why the type is taxonomy.
Update:
What actually confused me was that I didn’t know the return values of range. Instead of using the terrible workaround from above you can achieve the same more elegantly:
{{ range $section, $taxonomy := .Site.Sections }}
<h4>{{ replace $section "-" " " }}</h4>
<ul>
{{ range $taxonomy.Pages }}
<li><a href="{{ .Permalink}}"> {{ .LinkTitle }} </a> </li>
{{ end }}
</ul>
{{ end }}
im stack on this i want to show subsections
@digitalcraftsman, when I do the following, I get nothing. The part inside <ul>...</ul> works fine. What am I missing?
Hello @darshanbaral,
honestly, I don’t know why I used $section at all in the code example above. This was 4 years ago when I started using Hugo.
Instead you can use <h4>{{ $taxonomy.Title }}</h4>. This replace function, I guess, is invoked to avoid dashes that are commonly used in folder names.
A post was split to a new topic: How to list sections