Two Level Menu in Hyde Theme

Hello everyone
I am creating a static site with HUGO by using HYDE theme. I wanted to create two level menu (i.e. two level list) on the sidebar. My menu should look like this (you can see it here

What is DUNE

  • Features
  • News
  • License
  • Gallery
  • Publications and Talks
  • Dune Logo
  • Commercial Support
    DUNE modules
  • Core modules
  • Discretization modules
  • Grid managers
  • External modules

and so on

I am new to HUGO and it is drive me crazy to do this simple task. I will appreciate any kind of help from you guys.

Best Regards

Hi @Adeel_Akram,

each link in the second level seems to link to a self-contained content file. You could create a new folder for each top-level link and a new file within for each second-level menu link:


This code snippet should list all the folders and the files within and link them if I remember it right:

{{ range $section, $taxonomy := .Site.Sections }}
    <h4>{{ replace $section "-" " " }}</h4>
        {{ range $taxonomy.Pages }}
        <li><a href="{{ .Permalink}}"> {{ .LinkTitle }} </a> </li>
        {{ end }}
{{ end }}

@digitalcraftsman thanks for your quick reply. That might be one solution but it need to completely restructure my site.

I am trying to use guide at . I am proceeding as follows

  • In “config.toml” I have
    name = "About DUNE"
    weight = 0
    name = "DUNE Modules"
    weight = 9

  • in my (as 1st level item) I have in Front Matter
    menu = “main”

  • in my (as 1st level item) I have
    menu = "main"
    parent = “dune”

  • in my I have
    menu = "main"
    parent = “dune”

And in my sidebar.html I am using the code (see

This should work to since the sidebar of the docs use the same schema to display all subections.

Have a look at the menu structure in the Hugo docs:

1 Like