Menu
Updated: September 28, 2024
Hugo menu structures.
Table of Contents
MAIN MENUS
<nav class="menu-main">
{{ $currentPage := . }}
{{ range .Site.Menus.main }}
<a class="nav-item{{if or ($currentPage.IsMenuCurrent "main" .) ($currentPage.HasMenuCurrent "main" .) }} active{{end}}" href="{{ .URL }}" title="{{ .Title }}">{{ .Name }}</a>
{{ end }}
</nav>
SIDEBAR MENUS
<!-- Groups content according to content section. The ".Key" in this instance will be the section's title.--->
{{ range .Pages.GroupBy "Section" }}
<h3>{{ .Key }}</h3>
<ul>
{{ range .Pages.ByTitle }}
<li>
<a href="{{ .Permalink }}">{{ .Title }}</a>
</li>
{{ end }}
</ul>
{{ end }}
<nav class="navbar navbar-expand-lg navbar-light ">
<a class="navbar-brand" href="{{ "/" | relURL}}">{{.Site.Title}}</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ml-auto">
{{ $currentPage := . }}
{{ range .Site.Menus.main }}
{{ if not (eq .Identifier "tags") }}
<li class="navbar-item {{if or ($currentPage.IsMenuCurrent "main" .) ($currentPage.HasMenuCurrent "main" .) }} active{{end}}">
<a class="nav-link" href="{{ .URL | relURL }}" title="{{ .Title }}">{{ .Name }}</a>
</li>
{{ else }}
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="{{ .URL | relURL }}" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
{{ .Name }}
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
{{ range $name, $taxonomy := $currentPage.Site.Taxonomies.tags }}
{{ with $.Site.GetPage (printf "/tags/%s" $name) }}
<a class="dropdown-item" href="{{ .URL | relURL }}">{{ $name }}</a>
{{ end }}
{{ end }}
</div>
</li>
{{ end }}
{{ end }}
</ul>
</div>
</nav>
<nav class="menu-sidebar">
<h2>D3C3P7</h2>
<div>
<input type="checkbox" id="menu">
<label for="menu">Bash</label>
<div class="menu-content">
<ol>
{{ range (where .Site.Pages.ByTitle "Section" "bash") }}
<li>
<a href="{{ .Permalink }}">{{ lower .Title }}</a>
</li>
{{ end }}
</ol>
</div>
</div>
<div>
<input type="checkbox" id="menu">
<label for="menu">Mac</label>
<div class="menu-content0">
<ol>
{{ range (where .Site.Pages.ByTitle "Section" "mac") }}
<li>
<a href="{{ .Permalink }}">{{ .Title }}</a>
</li>
{{ end }}
</ol>
</div>
</div>
</nav>