mirror of
https://github.com/tiennm99/HugoBlox-kit.git
synced 2026-10-12 22:14:08 +00:00
feat: update Headroom implementation to support recent Hugo versions (#2950)
It has been reported that recent Hugo versions broke user's configuration of Headroom JS via the `header.on_scroll` option. With this PR, Headroom JS configuration is working again. Fixes #2935
This commit is contained in:
1 parent
92cc5a2710
commit
1c094227ec
1 file changed
+35
-4
@@ -126,12 +126,43 @@
|
|||||||
<script src="{{ $js_algolia_search.RelPermalink }}" type="module"></script>
|
<script src="{{ $js_algolia_search.RelPermalink }}" type="module"></script>
|
||||||
{{ end }}
|
{{ end }}
|
||||||
|
|
||||||
{{/* Page Data */}}
|
{{/* Headroom */}}
|
||||||
{{ $default_headroom := not (.IsHome | or (eq .Type "book")) }}
|
{{/*
|
||||||
{{ $use_headroom := cond (isset $.Params "header.on_scroll") (eq $.Params.header.on_scroll "disappear") (default $default_headroom) }}
|
Headroom JS enables hiding the header on scrolling down and showing it on scrolling up.
|
||||||
|
This is especially valuable on smaller displays such as mobile devices.
|
||||||
|
This option can be set in the following ways:
|
||||||
|
- globally, in the site's 'params.yaml':
|
||||||
|
```
|
||||||
|
header:
|
||||||
|
on_scroll: "disappear" | "sticky"
|
||||||
|
```
|
||||||
|
- per page, in the page front matter:
|
||||||
|
```
|
||||||
|
header:
|
||||||
|
on_scroll: "disappear" | "sticky"
|
||||||
|
```
|
||||||
|
When the header is set to disappear, the Headroom JS is loaded.
|
||||||
|
|
||||||
|
By default, the header is sticky in the homepage and in the book layout,
|
||||||
|
and it disappears when scrolling in all other pages.
|
||||||
|
*/}}
|
||||||
|
|
||||||
|
{{/* By default don't use Headroom in the homepage and book layout */}}
|
||||||
|
{{ $use_headroom := not (.IsHome | or (eq .Type "book")) }}
|
||||||
|
|
||||||
|
{{/* Check for the global site parameter `header.on_scroll` */}}
|
||||||
|
{{ if (isset site.Params.header "on_scroll") }}
|
||||||
|
{{ $use_headroom = eq site.Params.header.on_scroll "disappear" }}
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
{{/* Check for the page parameter `header.on_scroll` */}}
|
||||||
|
{{ if (isset $.Params.header "on_scroll") }}
|
||||||
|
{{ $use_headroom = eq $.Params.header.on_scroll "disappear" }}
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
{{/* Output `use_headroom` variable for Headroom initialization in Wowchemy JS */}}
|
||||||
{{ printf "<script id=\"page-data\" type=\"application/json\">%s</script>" (dict "use_headroom" $use_headroom | jsonify) | safeHTML}}
|
{{ printf "<script id=\"page-data\" type=\"application/json\">%s</script>" (dict "use_headroom" $use_headroom | jsonify) | safeHTML}}
|
||||||
|
|
||||||
{{/* Headroom */}}
|
|
||||||
{{ if $use_headroom }}
|
{{ if $use_headroom }}
|
||||||
{{ $headroom := resources.Get "js/wowchemy-headroom.js" | js.Build (dict "format" "esm" "minify" true) }}
|
{{ $headroom := resources.Get "js/wowchemy-headroom.js" | js.Build (dict "format" "esm" "minify" true) }}
|
||||||
{{- if hugo.IsProduction -}}
|
{{- if hugo.IsProduction -}}
|
||||||
|
|||||||
Reference in new issue
Block a user