ef02e34e Correct the mmark example frontmatter parameter 6e91e900 SectionPagesMenu > sectionPagesMenu 1a0db1a6 Adjust sectionPagesMenu f9f87d9d Fix extension's missing period. 7062ae07 Remove Press and Articles page 771f2b38 Remove outdated and redudant content file for release notes 64cf47c3 Remove outdated note in docs contribution guide bdb11b89 Fix typo 8324af70 Fixes broken link on Roadmap d93f0992 functions: Add all missing binary comparison operators fb7ae80a Fix typo in usage.md fbdae08b Fix typo in content-management/taxonomies.md 66fab8d2 Make <title> less stuttery b3cd4c22 Remove old temp release notes 5589ba96 Fix typos in templates/lists.md af3a0807 http > HTTP b2af90ae Remove formatting in description of blog article 6e2e60a9 Add blog article about Netlify files 0bb6f2f2 Use title in archetype file 7b2490ff Get the Archetypes up to new spec f401d69b Load CSS and JS via HTTP/2 server push 4aef4944 Adjust titles 362acdb2 Fix typo in quickstart c2440560 Remove inline icons from installation guide d2edcbc3 Revert "Fix links to Disqus template documentation" 622f49cf Add a full commands section at the quick start end 752f065b Fix server command in README 93e08e19 Fix links to Disqus template documentation 5e0cfaa9 Adjust Linux install d51397c2 Fix broken link in Quick Start 1fb39846 Add /quickstart alias to quickstart 7440616b Add new and simpler quickstart b3ec6986 Let page title correspond to function name replaceRE b44499c9 Add YouTube tutorial about taxonomies 88b9eb0e Add RSS templates example 6c0bde3f Update slice.md 6c212ea6 Reorder to match the following content order d2122992 Complete "content" spelling under theme components e4824eb3 Fix the output shortcode and its usage 0adfc945 Add archetypes YouTube video 638e9d9b Fix double "your" typo in taxonomies.md git-subtree-dir: docs git-subtree-split: ef02e34eaf296c3f94b4446b3c3347771e786057
3.5 KiB
title | linktitle | description | date | publishdate | lastmod | categories | menu | weight | sections_weight | draft | aliases | toc | ||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Menu Templates | Menu Templates | Menus are a powerful but simple feature for content management but can be easily manipulated in your templates to meet your design needs. | 2017-02-01 | 2017-02-01 | 2017-02-01 |
|
|
130 | 130 | false |
|
false |
Hugo makes no assumptions about how your rendered HTML will be structured. Instead, it provides all of the functions you will need to be able to build your menu however you want.
The following is an example:
{{< code file="layouts/partials/sidebar.html" download="sidebar.html" >}}
{{< /code >}}{{% note "absLangURL
and relLangURL
" %}}
Use the absLangUrl
or relLangUrl
functions if your theme makes use of the multilingual feature. In contrast to absURL
and relURL
, these two functions add the correct language prefix to the url.
{{% /note %}}
Section Menu for Lazy Bloggers
To enable this menu, configure sectionPagesMenu
in your site config
:
sectionPagesMenu = "main"
The menu name can be anything, but take a note of what it is.
This will create a menu with all the sections as menu items and all the sections' pages as "shadow-members". The shadow implies that the pages isn't represented by a menu-item themselves, but this enables you to create a top-level menu like this:
<nav class="sidebar-nav">
{{ $currentPage := . }}
{{ range .Site.Menus.main }}
<a class="sidebar-nav-item{{if or ($currentPage.IsMenuCurrent "main" .) ($currentPage.HasMenuCurrent "main" .) }} active{{end}}" href="{{.URL}}">{{ .Name }}</a>
{{ end }}
</nav>
In the above, the menu item is marked as active if on the current section's list page or on a page in that section.
The above is all that's needed. But if you want custom menu items, e.g. changing weight or name, you can define them manually in the site config, i.e. config.toml
:
[[menu.main]]
name = "This is the blog section"
weight = -110
identifier = "blog"
url = "/blog/"
{{% note %}}
The identifier
must match the section name.
{{% /note %}}