Add breadcrumb navigation

Disabled by default, and you probably want to keep it that way. It
doesn't fit in very well with the design currently. I just found it in
the Hugo docs and thought I might as well put it in for safe keeping.
This commit is contained in:
BBaoVanC 2021-10-01 20:54:18 -05:00
parent 1fe6a4c428
commit 157feeb814
Signed by: bbaovanc
GPG Key ID: 18089E4E3CCF1D3A
4 changed files with 51 additions and 11 deletions

View File

@ -46,3 +46,27 @@ blockquote {
border-left: 5px solid #222; border-left: 5px solid #222;
padding-left: 10px; padding-left: 10px;
} }
/* Breadcrumb Navigation */
ul.breadcrumb {
padding 10px 16px;
list-style: none;
}
ul.breadcrumb li {
display: inline;
}
ul.breadcrumb li a {
text-decoration: none;
}
ul.breadcrumb li+li:before {
padding: 8px;
content: "/\00a0";
}
ul.breadcrumb li.active a {
color: inherit;
text-decoration: none;
}

View File

@ -4,7 +4,20 @@
{{- partial "head.html" . -}} {{- partial "head.html" . -}}
<body> <body>
{{ partial "header.html" . }} <h2 class="header">
<a href="{{ "/" | relURL }}">{{ .Site.Title | markdownify }}</a>
</h2>
<nav id="navbar">
<a class="navbar-item" href="{{ "/" | relURL }}">Home</a>
{{ range .Site.Menus.main }}
<a class="navbar-item" href="{{ .URL }}">{{ .Name }}</a>
{{ end }}
</nav>
{{ if .Site.Params.breadcrumbnav }}
{{ partial "breadcrumb.html" . }}
{{ end }}
<div class="content"> <div class="content">
{{- block "main" . }} {{- block "main" . }}

View File

@ -0,0 +1,13 @@
<ul class="breadcrumb">
{{ template "breadcrumbnav" (dict "p1" . "p2" .) }}
</ul>
{{ define "breadcrumbnav" }}
{{ if .p1.Parent }}
{{ template "breadcrumbnav" (dict "p1" .p1.Parent "p2" .p2 ) }}
{{ else if not .p1.IsHome }}
{{ template "breadcrumbnav" (dict "p1" .p1.Site.Home "p2" .p2 ) }}
{{ end }}
<li{{ if eq .p1 .p2 }} class="active"{{ end }}>
<a href="{{ .p1.Permalink }}">{{ .p1.Title }}</a>
</li>
{{ end }}

View File

@ -1,10 +0,0 @@
<h2 class="header">
<a href="{{ "/" | relURL }}">{{ .Site.Title | markdownify }}</a>
</h2>
<nav id="navbar">
<a class="navbar-item" href="{{ "/" | relURL }}">Home</a>
{{ range .Site.Menus.main }}
<a class="navbar-item" href="{{ .URL }}">{{ .Name }}</a>
{{ end }}
</nav>