hugo/content/en/content-management/menus.md
Bjørn Erik Pedersen 13e64d7276 Squashed 'docs/' changes from 9b494a58c..6b00298bb
6b00298bb Remove outdated "related example"
987f1e1cd Fix dead links (#601)
96287a20a Add config option "summaryLength" (#600)
ced7f2085 Adjust Over showcase
e334a6354 Add new showcase: over
10435b502 Add warning about privacy options only work with internal templates (#525)
48c6b0e4d Minor grammatical fix
684670ebc Add quote
0e9fada52 Improvements to taxonomy template examples
e06c4bf73 Add syntax highlighting; consistent 4-space indentation
c1cb3f081 Remove dead links for custom permalinks
3e3aefd04 Fix 0a671bc3751479e74a0a9d2132736c61d239707c
d65888685 fix file name in 'Add Non-content Entries to a Menu' code toggle (#547)
1a0563857 Add Solus install guide (#590)
8a0d65b0d Update Windows Installation instructions (#564)
c4348636a Fix typo
0a671bc37 Add post to menu example
af14497c6 Add notes for `os.Stat` (Hugo 0.47) (#557)
e49f65bb3 Singular to plural
cb5608dbf Update introduction.md
30b060dff Add variable re-definition example (Hugo v0.48+)
21123967e Minor edits
fac3df043 Refresh the Go Templates introduction
4a9600e92 Updating URL to how-to-guide for hosting hugo site on firebase
bfaa7779c add missing word
c2cb5d09b Tweak 'name: weight' to 'name: date' in example (#582)
5ea938ad6 Remove some Scratch
2708dcd57 Release 0.48
e375d0f05 Merge branch 'temp48'
75e36c160 releaser: Prepare repository for 0.49-DEV
a6102f253 releaser: Add release notes to /docs for release of 0.48
41fc35db4 releaser: Bump versions for release of 0.48
64b9ecc74 Spell out the npm command for installing PostCSS
19e900a17 Improved Related Content doc
fe21600e7 Merge commit '844aef544c19e9d8f529b4f8144e089d0982bb34'
844aef544 Squashed 'themes/gohugoioTheme/' changes from 66249819..68ddff44
069828db8 Update git.md
d881d1433 Make default "related" behavior more explicit
60b9160eb Add docs for displaying 404 page on CloudFront
b72ebc760 Add .gitattributes to /resources
000cf85f4 Make the pros/cons styling consistent for summaries; use desc list
ebf1da97a Add note about outputStyle compressed
e3338ee91 Triple backquote syntax fix
361962a7c Add one more Blogger to Hugo tool for Windows (.NET Framework 4.5) (#540)
066606a21 Fix wrong link about Mmark Syntax Document
faee70757 Added exitwp-for-hugo
6b4108051 Add hugo-wrapper to starter-kits
4695dfba2 Added Utterances as Comments Alternatives.
c7ba9e3e1 Correct typo
beb850d9f Release 0.47.1
1cf417c8a Merge branch 'temp471'
0843bc46c releaser: Prepare repository for 0.48-DEV
8ff5c8b70 releaser: Add release notes to /docs for release of 0.47.1
e2353434d releaser: Bump versions for release of 0.47.1
ffb1300af Update development.md
c22234ea5 netlify: Minify output
5b9191c56 Release 0.47
bfd92cf52 releaser: Prepare repository for 0.48-DEV
ac7acf730 releaser: Add release notes to /docs for release of 0.47
b0096099d releaser: Bump versions for release of 0.47
86a7ae459 docs: Regenerate CLI docs
d2c8b72bc Merge commit 'a95896878f4b4a79448b39ce93a4e0d3258b4a43'
84de7ef59 Merge commit '3a44bf182fed5f34621f450114083a6dd7e88a07'

git-subtree-dir: docs
git-subtree-split: 6b00298bb26b700281df28817b6556e7480cdd1e
2018-09-14 08:34:58 +02:00

3.5 KiB
Raw Blame History

title linktitle description date publishdate lastmod categories keywords draft menu weight aliases toc
Menus Menus Hugo has a simple yet powerful menu system. 2017-02-01 2017-02-01 2017-03-31
content management
menus
false
docs
parent weight
content-management 120
120
/extras/menus/
true

{{% note "Lazy Blogger"%}} If all you want is a simple menu for your sections, see the "Section Menu for Lazy Bloggers" in Menu Templates. {{% /note %}}

You can do this:

  • Place content in one or many menus
  • Handle nested menus with unlimited depth
  • Create menu entries without being attached to any content
  • Distinguish active element (and active branch)

What is a Menu in Hugo?

A menu is a named array of menu entries accessible by name via the .Site.Menus site variable. For example, you can access your site's main menu via .Site.Menus.main.

{{% note "Menus on Multilingual Sites" %}} If you make use of the multilingual feature, you can define language-independent menus. {{% /note %}}

See the Menu Entry Properties for all the variables and functions related to a menu entry.

Add content to menus

Hugo allows you to add content to a menu via the content's front matter.

Simple

If all you need to do is add an entry to a menu, the simple form works well.

A Single Menu

---
menu: "main"
---

Multiple Menus

---
menu: ["main", "footer"]
---

Advanced

---
menu:
  docs:
    parent: 'extras'
    weight: 20
---

Add Non-content Entries to a Menu

You can also add entries to menus that arent attached to a piece of content. This takes place in your Hugo project's config file.

Heres an example snippet pulled from a configuration file:

{{< code-toggle file="config" >}} menu.main name = "about hugo" pre = "" weight = -110 identifier = "about" url = "/about/" menu.main name = "getting started" pre = "" post = "New!" weight = -100 url = "/getting-started/" {{< /code-toggle >}}

{{% note %}} The URLs must be relative to the context root. If the baseURL is https://example.com/mysite/, then the URLs in the menu must not include the context root mysite. Using an absolute URL will override the baseURL. If the value used for URL in the above example is https://subdomain.example.com/, the output will be https://subdomain.example.com. {{% /note %}}

Nesting

All nesting of content is done via the parent field.

The parent of an entry should be the identifier of another entry. The identifier should be unique (within a menu).

The following order is used to determine an Identifier:

.Name > .LinkTitle > .Title

This means that .Title will be used unless .LinkTitle is present, etc. In practice, .Name and .Identifier are only used to structure relationships and therefore never displayed.

In this example, the top level of the menu is defined in your site config file). All content entries are attached to one of these entries via the .Parent field.

Render Menus

See Menu Templates for information on how to render your site menus within your templates.