In my previous version of the auto-collapsing (nested) menu I chose to avoid Hugo’s subsections. However, due to an update of the breadcrumbs, I was motived to test the possibility to create a nested menu based on sections and subsections. I succeeded and the code became much cleaner/shorter and simpler, especially due to the ‘.Ancestors’ variable. The way to determine if a page is ‘active’ is done through the following code:| Hugo Codex
Hugo, the website framework that is super fast, because fast is simply better.| Hugo Codex
Hugo, the website framework that is super fast, because fast is simply better.| Hugo Codex
Hugo, the website framework that is super fast, because fast is simply better.| Hugo Codex
Hugo, the website framework that is super fast, because fast is simply better.| Hugo Codex
Hugo, the website framework that is super fast, because fast is simply better.| Hugo Codex
Hugo, the website framework that is super fast, because fast is simply better.| Hugo Codex
A lot of websites use an auto-collapsing menu. It is a great and compact way to show a lot of content in a structured way, but it requires a hierarchical view of all your pages. This post explains how to do that. Different approaches I tried some different approaches. I started out with the assumption that I was not allowed to use folders in sections. I was under the impression that a folder in a section would create a subsection.| Hugo Codex
Introduction A lot of websites use auto-collapsing menu’s with nested pages. They are a great way to show a lot of content in a structured way, but it requires a hierarchical view of all your pages. This is a nested menu that can be added through a simple include. If you want to see this in action, you can view a demo. How it works This script reads the folders in your section and automatically creates an auto-collapsing nested menu.| Hugo Codex