Hugo Advance Docs

Main Menu

Adding menu items in config.toml

Configure the main menu by editing the config.toml

# config.toml

[menu]
    [[menu.main]]
        name = "Work"
        url = "/work/"
        weight = 2

    [[menu.main]]
        name = "Buy Now"
        url = "https://www.zerostatic.io/theme/hugo-advance/"
        weight = 10

Adding menu items in a page front-matter

# content/en/pages/about.md
---
title: "About"
...
menu:
  main:
    weight: 5
    name: "About"
  footer_secondary:
    weight: 2
---

Nested / dropdown menu

The main menu supports nested menus. Enable this feature in the config.toml

# config.toml

[params]
    enable_nested_menu = true # allows dropdown menus in main menu

The services section of this theme provides a working example of sub menus.

For sub menus to work, you need to add the identifier property to the top level menu item, in this case the main /services page.

# content/en/services/_index_.md
---
title: 'Services'
...
menu:
  main:
      identifier: services # child menu items refer to this using `parent: "services"`
      url: /services/
      weight: 1
  footer_primary:
      identifier: services_footer
      url: /services/
      weight: 1
---

Then add the parent property to the menu in the child pages.

# content/en/services/branding.md
---
title: 'Branding'
...
menu:
  main:
    weight: 4
    parent: "services" # matches the `identifier` declared above
---