From 3762d3a24cf1b77e6d9bf1223ebdda173e53f498 Mon Sep 17 00:00:00 2001 From: John Feminella Date: Sun, 29 May 2022 14:46:30 -0400 Subject: Modularize and baseof templates (#639) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * Add extension points for template customization Today, if you use the hugo-coder template, you can't modify without having to write the entire template from scratch. This makes small point modifications or adjustments impractical and means that downstream consumers will quickly be out of sync with upstream changes. To remedy this, we split up the template into more modular extension points. This commit adds one extension point to for arbitrary scripting and several more to for different existing touchpoints. * Add John Feminella to CONTRIBUTORS.md * Modularize home.html template Co-authored-by: Luiz F. A. de Prá --- CONTRIBUTORS.md | 1 + layouts/_default/baseof.html | 203 ++++++--------------- layouts/partials/body/extensions.html | 5 + layouts/partials/head.html | 23 +++ .../partials/head/alternative-output-formats.html | 3 + layouts/partials/head/color-scheme.html | 11 ++ layouts/partials/head/custom-icons.html | 5 + layouts/partials/head/custom-styles.html | 21 +++ layouts/partials/head/extensions.html | 4 + layouts/partials/head/hugo-generator.html | 1 + layouts/partials/head/meta-tags.html | 15 ++ layouts/partials/head/theme-styles.html | 23 +++ layouts/partials/home.html | 36 +--- layouts/partials/home/author.html | 6 + layouts/partials/home/avatar.html | 8 + layouts/partials/home/social.html | 17 ++ 16 files changed, 205 insertions(+), 177 deletions(-) create mode 100644 layouts/partials/body/extensions.html create mode 100644 layouts/partials/head.html create mode 100644 layouts/partials/head/alternative-output-formats.html create mode 100644 layouts/partials/head/color-scheme.html create mode 100644 layouts/partials/head/custom-icons.html create mode 100644 layouts/partials/head/custom-styles.html create mode 100644 layouts/partials/head/extensions.html create mode 100644 layouts/partials/head/hugo-generator.html create mode 100644 layouts/partials/head/meta-tags.html create mode 100644 layouts/partials/head/theme-styles.html create mode 100644 layouts/partials/home/author.html create mode 100644 layouts/partials/home/avatar.html create mode 100644 layouts/partials/home/social.html diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md index badb8df..818a10a 100644 --- a/CONTRIBUTORS.md +++ b/CONTRIBUTORS.md @@ -108,4 +108,5 @@ - [Xiaoyang Luo](https://github.com/ccviolett/) - [Michiel Appelman](https://appelman.se) - [Mark Wood](https://digitalnotions.net) +- [John Feminella](https://jxf.me) - [zzsqwq](https://zzsqwq.cn) diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html index 6b2238d..d29d508 100644 --- a/layouts/_default/baseof.html +++ b/layouts/_default/baseof.html @@ -1,160 +1,71 @@ - - - - - - - {{ if .Site.Params.csp }} - {{ partial "csp.html" . }} - {{ end }} - - {{ with .Site.Params.author }}{{ end }} - - - - {{ template "_internal/twitter_cards.html" . }} - {{ template "_internal/opengraph.html" . }} - - {{ block "title" . }}{{ .Site.Title }}{{ end }} - - {{ if .Permalink }} - - {{ end }} - - - - {{ if .Site.IsServer }} - {{ $cssOpts := (dict "targetPath" "css/coder.css" "enableSourceMap" true ) }} - {{ $styles := resources.Get "scss/coder.scss" | resources.ExecuteAsTemplate "style.coder.css" . | toCSS $cssOpts }} - - {{ else }} - {{ $cssOpts := (dict "targetPath" "css/coder.css" ) }} - {{ $styles := resources.Get "scss/coder.scss" | resources.ExecuteAsTemplate "style.coder.css" . | toCSS $cssOpts | minify | fingerprint }} - - {{ end }} - - {{ if .Site.Params.rtl }} - {{ if .Site.IsServer }} - {{ $cssOpts := (dict "targetPath" "css/coder-rtl.css" "enableSourceMap" true ) }} - {{ $styles := resources.Get "scss/coder-rtl.scss" | resources.ExecuteAsTemplate "style.coder-rtl.css" . | toCSS $cssOpts }} - - {{ else }} - {{ $cssOpts := (dict "targetPath" "css/coder-rtl.css" ) }} - {{ $styles := resources.Get "scss/coder-rtl.scss" | resources.ExecuteAsTemplate "style.coder-rtl.css" . | toCSS $cssOpts | minify | fingerprint }} - - {{ end }} - {{ end }} - - {{ if or (eq .Site.Params.colorScheme "auto") (eq .Site.Params.colorScheme "dark") }} - {{ if .Site.IsServer }} - {{ $cssOpts := (dict "targetPath" "css/coder-dark.css" "enableSourceMap" true ) }} - {{ $styles := resources.Get "scss/coder-dark.scss" | resources.ExecuteAsTemplate "style.coder-dark.css" . | toCSS $cssOpts }} - - {{ else }} - {{ $cssOpts := (dict "targetPath" "css/coder-dark.css" ) }} - {{ $styles := resources.Get "scss/coder-dark.scss" | resources.ExecuteAsTemplate "style.coder-dark.css" . | toCSS $cssOpts | minify | fingerprint }} - - {{ end }} - {{ end }} - - {{ range .Site.Params.customCSS }} - {{ if $.Site.IsServer }} - {{ $styles := resources.Get . }} - - {{ else }} - {{ $styles := resources.Get . | minify | fingerprint }} - - {{ end }} - {{ end }} - - {{ range .Site.Params.customSCSS }} - {{/* We don't change the targetPath to because it's transparent to users */}} - {{ if $.Site.IsServer }} - {{ $cssOpts := (dict "enableSourceMap" true ) }} - {{ $styles := resources.Get . | toCSS $cssOpts }} - - {{ else }} - {{ $styles := resources.Get . | toCSS | minify | fingerprint }} - - {{ end }} - {{ end }} - - - - - - - - {{ range .AlternativeOutputFormats -}} - {{ printf `` .Rel .MediaType.Type .RelPermalink $.Site.Title | safeHTML }} - {{ end -}} - - {{ hugo.Generator }} - - - {{ $csClass := "colorscheme-light" }} - {{ if eq .Site.Params.colorScheme "dark" }} - {{ $csClass = "colorscheme-dark" }} - {{ else if eq .Site.Params.colorScheme "auto" }} - {{ $csClass = "colorscheme-auto" }} +{{ partial "head.html" . }} + +{{ $csClass := "colorscheme-light" }} +{{ if eq .Site.Params.colorScheme "dark" }} +{{ $csClass = "colorscheme-dark" }} +{{ else if eq .Site.Params.colorScheme "auto" }} +{{ $csClass = "colorscheme-auto" }} +{{ end }} + + + {{ partial "float" . }} +
+ {{ partial "header.html" . }} + +
+ {{ block "content" . }}{{ end }} +
+ + {{ partial "footer.html" . }} +
+ + {{ if .Site.IsServer }} + {{ $script := resources.Get "js/coder.js" }} + + {{ else }} + {{ $script := resources.Get "js/coder.js" | minify | fingerprint }} + {{ end }} - - {{ partial "float" . }} -
- {{ partial "header.html" . }} - -
- {{ block "content" . }}{{ end }} -
- {{ partial "footer.html" . }} -
- - {{ if .Site.IsServer }} - {{ $script := resources.Get "js/coder.js" }} - - {{ else }} - {{ $script := resources.Get "js/coder.js" | minify | fingerprint }} - - {{ end }} + {{ range .Site.Params.customJS }} + {{ if $.Site.IsServer }} + {{ $script := resources.Get . }} + + {{ else }} + {{ $script := resources.Get . | minify | fingerprint }} + + {{ end }} + {{ end }} - {{ range .Site.Params.customJS }} - {{ if $.Site.IsServer }} - {{ $script := resources.Get . }} - - {{ else }} - {{ $script := resources.Get . | minify | fingerprint }} - - {{ end }} - {{ end }} + {{ template "_internal/google_analytics.html" . }} - {{ template "_internal/google_analytics.html" . }} + {{ if and .Site.Params.fathomAnalytics .Site.Params.fathomAnalytics.siteID }} + {{- partial "analytics/fathom" . -}} + {{ end }} - {{ if and .Site.Params.fathomAnalytics .Site.Params.fathomAnalytics.siteID }} - {{- partial "analytics/fathom" . -}} - {{ end }} + {{ if and .Site.Params.plausibleAnalytics .Site.Params.plausibleAnalytics.domain }} + {{- partial "analytics/plausible" . -}} + {{ end }} - {{ if and .Site.Params.plausibleAnalytics .Site.Params.plausibleAnalytics.domain }} - {{- partial "analytics/plausible" . -}} - {{ end }} + {{ if and .Site.Params.goatCounter .Site.Params.goatCounter.code }} + {{- partial "analytics/goatcounter" . -}} + {{ end }} - {{ if and .Site.Params.goatCounter .Site.Params.goatCounter.code }} - {{- partial "analytics/goatcounter" . -}} - {{ end }} + {{ if and .Site.Params.cloudflare .Site.Params.cloudflare.token }} + {{- partial "analytics/cloudflare" . -}} + {{ end }} - {{ if and .Site.Params.cloudflare .Site.Params.cloudflare.token }} - {{- partial "analytics/cloudflare" . -}} - {{ end }} + {{ if and .Site.Params.matomo .Site.Params.matomo.serverURL }} + {{- partial "analytics/matomo" . -}} + {{ end }} - {{ if and .Site.Params.matomo .Site.Params.matomo.serverURL }} - {{- partial "analytics/matomo" . -}} - {{ end }} + {{ if and .Site.Params.googleTagManager .Site.Params.googleTagManager.id }} + {{- partial "analytics/googletagmanager" . -}} + {{ end }} - {{ if and .Site.Params.googleTagManager .Site.Params.googleTagManager.id }} - {{- partial "analytics/googletagmanager" . -}} - {{ end }} - + {{- partial "body/extensions" . -}} + diff --git a/layouts/partials/body/extensions.html b/layouts/partials/body/extensions.html new file mode 100644 index 0000000..6dddea7 --- /dev/null +++ b/layouts/partials/body/extensions.html @@ -0,0 +1,5 @@ +{{/* + This extension point occurs just before the end of each page's tag. + + You can add further theme extensions or customizations here if needed. +*/}} diff --git a/layouts/partials/head.html b/layouts/partials/head.html new file mode 100644 index 0000000..739c723 --- /dev/null +++ b/layouts/partials/head.html @@ -0,0 +1,23 @@ + + {{ partial "head/meta-tags.html" . }} + + {{ block "title" . }}{{ .Site.Title }}{{ end }} + + {{ if .Permalink }} + + {{ end }} + + {{ partialCached "head/theme-styles.html" . }} + + {{ partialCached "head/color-scheme.html" . }} + + {{ partialCached "head/custom-styles.html" . }} + + {{ partialCached "head/custom-icons.html" . }} + + {{ partialCached "head/alternative-output-formats.html" . }} + + {{ partialCached "head/hugo-generator.html" . }} + + {{ partial "head/extensions.html" . }} + diff --git a/layouts/partials/head/alternative-output-formats.html b/layouts/partials/head/alternative-output-formats.html new file mode 100644 index 0000000..8b1829a --- /dev/null +++ b/layouts/partials/head/alternative-output-formats.html @@ -0,0 +1,3 @@ +{{ range .AlternativeOutputFormats -}} + {{ printf `` .Rel .MediaType.Type .RelPermalink $.Site.Title | safeHTML }} +{{ end -}} diff --git a/layouts/partials/head/color-scheme.html b/layouts/partials/head/color-scheme.html new file mode 100644 index 0000000..7a55e8e --- /dev/null +++ b/layouts/partials/head/color-scheme.html @@ -0,0 +1,11 @@ +{{ if or (eq .Site.Params.colorScheme "auto") (eq .Site.Params.colorScheme "dark") }} + {{ if .Site.IsServer }} + {{ $cssOpts := (dict "targetPath" "css/coder-dark.css" "enableSourceMap" true ) }} + {{ $styles := resources.Get "scss/coder-dark.scss" | resources.ExecuteAsTemplate "style.coder-dark.css" . | toCSS $cssOpts }} + + {{ else }} + {{ $cssOpts := (dict "targetPath" "css/coder-dark.css" ) }} + {{ $styles := resources.Get "scss/coder-dark.scss" | resources.ExecuteAsTemplate "style.coder-dark.css" . | toCSS $cssOpts | minify | fingerprint }} + + {{ end }} +{{ end }} diff --git a/layouts/partials/head/custom-icons.html b/layouts/partials/head/custom-icons.html new file mode 100644 index 0000000..f7bfae5 --- /dev/null +++ b/layouts/partials/head/custom-icons.html @@ -0,0 +1,5 @@ + + + + + diff --git a/layouts/partials/head/custom-styles.html b/layouts/partials/head/custom-styles.html new file mode 100644 index 0000000..6496963 --- /dev/null +++ b/layouts/partials/head/custom-styles.html @@ -0,0 +1,21 @@ + {{ range .Site.Params.customCSS }} + {{ if $.Site.IsServer }} + {{ $styles := resources.Get . }} + + {{ else }} + {{ $styles := resources.Get . | minify | fingerprint }} + + {{ end }} +{{ end }} + +{{ range .Site.Params.customSCSS }} + {{/* We don't change the targetPath to because it's transparent to users */}} + {{ if $.Site.IsServer }} + {{ $cssOpts := (dict "enableSourceMap" true ) }} + {{ $styles := resources.Get . | toCSS $cssOpts }} + + {{ else }} + {{ $styles := resources.Get . | toCSS | minify | fingerprint }} + + {{ end }} +{{ end }} diff --git a/layouts/partials/head/extensions.html b/layouts/partials/head/extensions.html new file mode 100644 index 0000000..a9eb885 --- /dev/null +++ b/layouts/partials/head/extensions.html @@ -0,0 +1,4 @@ +{{/* + You can add further theme extensions or customizations here if they should + appear in . +*/}} diff --git a/layouts/partials/head/hugo-generator.html b/layouts/partials/head/hugo-generator.html new file mode 100644 index 0000000..cee2034 --- /dev/null +++ b/layouts/partials/head/hugo-generator.html @@ -0,0 +1 @@ +{{ hugo.Generator }} diff --git a/layouts/partials/head/meta-tags.html b/layouts/partials/head/meta-tags.html new file mode 100644 index 0000000..aa929db --- /dev/null +++ b/layouts/partials/head/meta-tags.html @@ -0,0 +1,15 @@ + + + + +{{ if .Site.Params.csp }} +{{ partial "csp.html" . }} +{{ end }} + +{{ with .Site.Params.author }} +{{ end }} + + + +{{ template "_internal/twitter_cards.html" . }} +{{ template "_internal/opengraph.html" . }} diff --git a/layouts/partials/head/theme-styles.html b/layouts/partials/head/theme-styles.html new file mode 100644 index 0000000..720b7b2 --- /dev/null +++ b/layouts/partials/head/theme-styles.html @@ -0,0 +1,23 @@ + + +{{ if .Site.IsServer }} + {{ $cssOpts := (dict "targetPath" "css/coder.css" "enableSourceMap" true ) }} + {{ $styles := resources.Get "scss/coder.scss" | resources.ExecuteAsTemplate "style.coder.css" . | toCSS $cssOpts }} + +{{ else }} + {{ $cssOpts := (dict "targetPath" "css/coder.css" ) }} + {{ $styles := resources.Get "scss/coder.scss" | resources.ExecuteAsTemplate "style.coder.css" . | toCSS $cssOpts | minify | fingerprint }} + +{{ end }} + +{{ if .Site.Params.rtl }} + {{ if .Site.IsServer }} + {{ $cssOpts := (dict "targetPath" "css/coder-rtl.css" "enableSourceMap" true ) }} + {{ $styles := resources.Get "scss/coder-rtl.scss" | resources.ExecuteAsTemplate "style.coder-rtl.css" . | toCSS $cssOpts }} + + {{ else }} + {{ $cssOpts := (dict "targetPath" "css/coder-rtl.css" ) }} + {{ $styles := resources.Get "scss/coder-rtl.scss" | resources.ExecuteAsTemplate "style.coder-rtl.css" . | toCSS $cssOpts | minify | fingerprint }} + + {{ end }} +{{ end }} diff --git a/layouts/partials/home.html b/layouts/partials/home.html index ff640dd..85ca04e 100644 --- a/layouts/partials/home.html +++ b/layouts/partials/home.html @@ -1,35 +1,9 @@
- {{ if and (isset .Site.Params "avatarurl") (not (isset .Site.Params "gravatar")) }} - {{ with .Site.Params.avatarURL }} -
avatar
- {{ end }} - {{ end }} - {{ with .Site.Params.gravatar }} -
gravatar
- {{ end }} -

{{ .Site.Params.author }}

- {{ if reflect.IsSlice .Site.Params.info }} -

{{ range .Site.Params.info }}{{.}}
{{ end}}

- {{ else }} -

{{ .Site.Params.info }}

- {{ end }} - {{ with .Site.Params.social }} -
    - {{ range sort . "weight" }} - {{ if .icon }} -
  • - - - -
    • - {{ else }} -
  • - {{ .name }} -
    • - {{ end }} - {{ end }} -
- {{ end }} + {{ partialCached "home/avatar.html" . }} + + {{ partialCached "home/author.html" . }} + + {{ partialCached "home/social.html" . }}
diff --git a/layouts/partials/home/author.html b/layouts/partials/home/author.html new file mode 100644 index 0000000..699447b --- /dev/null +++ b/layouts/partials/home/author.html @@ -0,0 +1,6 @@ +

{{ .Site.Params.author }}

+{{ if reflect.IsSlice .Site.Params.info }} +

{{ range .Site.Params.info }}{{.}}
{{ end}}

+{{ else }} +

{{ .Site.Params.info }}

+{{ end }} diff --git a/layouts/partials/home/avatar.html b/layouts/partials/home/avatar.html new file mode 100644 index 0000000..4928915 --- /dev/null +++ b/layouts/partials/home/avatar.html @@ -0,0 +1,8 @@ +{{ if and (isset .Site.Params "avatarurl") (not (isset .Site.Params "gravatar")) }} + {{ with .Site.Params.avatarURL }} +
avatar
+ {{ end }} +{{ end }} +{{ with .Site.Params.gravatar }} +
gravatar
+{{ end }} diff --git a/layouts/partials/home/social.html b/layouts/partials/home/social.html new file mode 100644 index 0000000..8d726c8 --- /dev/null +++ b/layouts/partials/home/social.html @@ -0,0 +1,17 @@ +{{ with .Site.Params.social }} + +{{ end }} \ No newline at end of file -- cgit v1.2.3