mirror of
https://github.com/gohugoio/hugo.git
synced 2024-11-14 20:37:55 -05:00
13e64d7276
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
123 lines
3.5 KiB
Markdown
123 lines
3.5 KiB
Markdown
---
|
||
title: Menus
|
||
linktitle: Menus
|
||
description: Hugo has a simple yet powerful menu system.
|
||
date: 2017-02-01
|
||
publishdate: 2017-02-01
|
||
lastmod: 2017-03-31
|
||
categories: [content management]
|
||
keywords: [menus]
|
||
draft: false
|
||
menu:
|
||
docs:
|
||
parent: "content-management"
|
||
weight: 120
|
||
weight: 120 #rem
|
||
aliases: [/extras/menus/]
|
||
toc: 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](/templates/menu-templates/#section-menu-for-lazy-bloggers).
|
||
{{% /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][sitevars]. 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](/content-management/multilingual/), you can define language-independent menus.
|
||
{{% /note %}}
|
||
|
||
See the [Menu Entry Properties][me-props] 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](/content-management/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 aren’t attached to a piece of content. This takes place in your Hugo project's [`config` file][config].
|
||
|
||
Here’s an example snippet pulled from a configuration file:
|
||
|
||
{{< code-toggle file="config" >}}
|
||
[[menu.main]]
|
||
name = "about hugo"
|
||
pre = "<i class='fa fa-heart'></i>"
|
||
weight = -110
|
||
identifier = "about"
|
||
url = "/about/"
|
||
[[menu.main]]
|
||
name = "getting started"
|
||
pre = "<i class='fa fa-road'></i>"
|
||
post = "<span class='alert'>New!</span>"
|
||
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][config]). All content entries are attached to one of these entries via the `.Parent` field.
|
||
|
||
## Render Menus
|
||
|
||
See [Menu Templates](/templates/menu-templates/) for information on how to render your site menus within your templates.
|
||
|
||
[config]: /getting-started/configuration/
|
||
[multilingual]: /content-management/multilingual/
|
||
[sitevars]: /variables/
|
||
[me-props]: /variables/menus/
|