feat: add optional extra menu to site navigations (#26)

* feat: add optional extra menu to site navigations

* add extra menu documentation

* rename menu to menu-extra

* feat: add optional extra menu to site navigations

* add extra menu documentation

* rename menu to menu-extra

* fix spellcheck
This commit is contained in:
Robert Kaussow 2021-01-24 23:04:52 +01:00 committed by GitHub
parent 9d9a5cf557
commit 82f95b1766
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 83 additions and 22 deletions

View File

@ -11,6 +11,7 @@ emojify
img
JSON
SVG
YAML
pre-processor
pre-build
submodule

View File

@ -1,3 +0,0 @@
---
title: "Legal Notice"
---

View File

@ -429,3 +429,25 @@ geekblogAnchor: true
{{< /tab >}}
{{< /tabs >}}
## Menus
### Extra menu
If you want to customize the menus (header and footer), this can be achieved by a data file. This file needs to be written in YAML and placed at data/menu/extra.yml.
**Example:**
```Yaml
---
header:
- name: Github Profile
icon: github
ref: "https://github.com/xoxys"
external: true
footer:
- name: Contact
icon: email
ref: "/contact"
```

View File

@ -0,0 +1,11 @@
---
header:
- name: Github Profile
icon: github
ref: "https://github.com/xoxys"
external: true
footer:
- name: Contact
icon: email
ref: "/contact"

View File

@ -0,0 +1,35 @@
{{ $current := .current }}
{{ template "menu-file" dict "sect" .source "current" $current "site" $current.Site "target" .target }}
<!-- template -->
{{ define "menu-file" }}
{{ $current := .current }}
{{ $site := .site }}
{{ $target := .target }}
{{ range sort (default (seq 0) .sect) "weight" }}
{{ if isset . "ref" }}
{{ $this := $site.GetPage .ref }}
{{ $isCurrent := eq $current $this }}
{{ $icon := default false .icon }}
{{ if eq $target "footer" }}
<span class="gblog-footer__item">
{{ if $icon }}<svg class="icon {{ .icon }}"><use xlink:href="#{{ .icon }}"></use></svg>{{ end }}
<a href="{{ if .external }}{{ .ref }}{{ else }}{{ relref $current .ref }}{{ end }}"
class="gblog-footer__link">
{{ .name }}
</a>
</span>
{{ else if eq $target "header" }}
<li>
<a href="{{ if .external }}{{ .ref }}{{ else }}{{ relref $current .ref }}{{ end }}"
class="gblog-nav__entry {{ if $isCurrent }}is-active{{ end }}">
{{ if $icon }}<svg class="icon {{ .icon }}"><use xlink:href="#{{ .icon }}"></use></svg>{{ end }}
{{ .name }}
</a>
</li>
{{ end }}
{{ end }}
{{ end }}
{{ end }}

View File

@ -1,17 +1,14 @@
<footer class="gblog-footer">
<div class="container">
<div class="flex flex-wrap align-center">
<nav class="container">
<section class="flex flex-wrap align-center">
{{ with (.Site.GetPage "home").OutputFormats.Get "atom" }}
<span class="gblog-footer__item">
<svg class="icon rss_feed"><use xlink:href="#rss_feed"></use></svg>
<a href='{{ .Permalink | relURL }}' class="gblog-footer__link">Feed</a>
<a href='{{ .Permalink | relURL }}' class="gblog-footer__link">Atom Feed</a>
</span>
{{ end }}
{{ with .GetPage "contact.md" }}
<span class="gblog-footer__item">
<svg class="icon email"><use xlink:href="#email"></use></svg>
<a href='{{ .Permalink | relURL }}' class="gblog-footer__link">Contact</a>
</span>
{{ if .Site.Data.menu.extra.footer }}
{{ partial "menu-extra" (dict "current" . "source" .Site.Data.menu.extra.footer "target" "footer") }}
{{ end }}
{{ with .Site.Params.GeekblogLegalNotice }}
<span class="gblog-footer__item">
@ -23,24 +20,19 @@
<a href="{{ . | relURL }}" class="gblog-footer__link">Privacy Policy</a>
</span>
{{ end }}
{{ with .Site.Params.GeekblogContentLicense }}
<span class="gblog-footer__item">
Content licensed under <a href="{{ .link }}" class="gblog-footer__link no-wrap">{{ .name }}</a>
</span>
{{ end }}
</div>
<div class="flex flex-wrap align-center">
</section>
<section class="flex flex-wrap align-center">
<span class="gblog-footer__item">
Built with <a href="https://gohugo.io/" class="gblog-footer__link">Hugo</a> and
<svg class="icon heart"><use xlink:href="#heart"></use></svg>
</span>
</div>
</section>
{{ with .Site.Params.GeekblogHostedOn }}
<div class="flex flex-wrap align-center">
<section class="flex flex-wrap align-center">
<span class="gblog-footer__item">
Hosted on <a href="{{ .link }}" class="gblog-footer__link">{{ .name }}</a>
</span>
</div>
</section>
{{ end }}
</div>
</nav>
</footer>

View File

@ -29,5 +29,8 @@
</li>
{{ end }}
{{ end }}
{{ if .Site.Data.menu.extra.header }}
{{ partial "menu-extra" (dict "current" . "source" .Site.Data.menu.extra.header "target" "header") }}
{{ end }}
</ul>
</nav>