hugo/docs/content/en/configuration/menus.md

title	linkTitle	description	categories	keywords
Configure menus	Menus	Centrally define menu entries for one or more menus.

[!note] To understand Hugo's menu system, please refer to the menus page.

There are three ways to define menu entries:

1. Automatically
2. In front matter
3. In site configuration

This page covers the site configuration method.

Example

To define entries for a "main" menu:

{{< code-toggle file=hugo >}} menus.main name = 'Home' pageRef = '/' weight = 10

menus.main name = 'Products' pageRef = '/products' weight = 20

menus.main name = 'Services' pageRef = '/services' weight = 30 {{< /code-toggle >}}

This creates a menu structure that you can access with Menus method on a Site object:

{{ range .Site.Menus.main }}
  ...
{{ end }}

See menu templates for a detailed example.

To define entries for a "footer" menu:

{{< code-toggle file=hugo >}} menus.footer name = 'Terms' pageRef = '/terms' weight = 10

menus.footer name = 'Privacy' pageRef = '/privacy' weight = 20 {{< /code-toggle >}}

Access this menu structure in the same way:

{{ range .Site.Menus.footer }}
  ...
{{ end }}

Properties

Menu entries usually include at least three properties: name, weight, and either pageRef or url. Use pageRef for internal page destinations and url for external destinations.

These are the available menu entry properties:

{{% include "/_common/menu-entry-properties.md" %}}

pageRef

(string) The logical path of the target page. For example:

page kind	pageRef
home	/
page	/books/book-1
section	/books
taxonomy	/tags
term	/tags/foo

url

(string) The destination URL. Use this for external destinations only.

Nested menu

This nested menu demonstrates some of the available properties:

{{< code-toggle file=hugo >}} menus.main name = 'Products' pageRef = '/products' weight = 10

menus.main name = 'Hardware' pageRef = '/products/hardware' parent = 'Products' weight = 1

menus.main name = 'Software' pageRef = '/products/software' parent = 'Products' weight = 2

menus.main name = 'Services' pageRef = '/services' weight = 20

menus.main name = 'Hugo' pre = '' url = 'https://gohugo.io/' weight = 30 [menus.main.params] rel = 'external' {{< /code-toggle >}}