add optional per-page CSS and JS, right-side footer, and image alts (#3)

Co-authored-by: max.mehl <max.mehl@fsfe.org>
author: Matthias Gärtner <g@rtner.de> 2021-06-13 16:07:32 +0300
committer: GitHub <noreply@github.com> 2021-06-13 16:07:32 +0300
commit: ee351229a7db5022d3cec810d5565a4fdd3b9d1d (patch)
tree: f282343023df53042117216adc943387a6064de7
parent: 6c632cb513f40104f68fff76bb0732083c3195fc (diff)
11 files changed, 61 insertions, 29 deletions
diff --git a/README.md b/README.md
index 1ee0576..d45312b 100644
--- a/README.md
+++ b/README.md
@@ -90,7 +90,7 @@ theme = "hugo-dpsg"
   mainSections = ["post", "blog", "news"] # Specify section pages to show on home page and the "Recent articles" widget
   photosSections = ["photos"] # Specify section pages to show on home page and the "Recent photos" widget
   dateformat = "02.01.2006" # Change the format of dates
-  customCSS = ["css/custom.css"] # Include custom CSS files
+  customCSS = ["css/custom.css"] # Include custom CSS files, can also be used per-page as front matter attribute
   customJS = ["js/custom.js"] # Include custom JS files
   customPartial = "piwik.html" # Include custom partials, e.g. tracking codes
 
@@ -99,6 +99,7 @@ theme = "hugo-dpsg"
 
 [Params.logo]
   image = "img/placeholder.png" # Logo image. Path relative to "static"
+  image_alt = "Logo image" # alt text for logo image, be screen reader friendly!
   header = "img/header.jpg" # Header image. Path relative to "static"
   title = "DPSG local group" # Logo title, otherwise will use site title
   subtitle = "Welcome to our group site" # Logo subtitle
@@ -114,6 +115,7 @@ theme = "hugo-dpsg"
 
 [Params.footer]
   text = "[Imprint and Privacy](/imprint)" # Extra text in footer row, understands markdown
+  right = "Donate!" # Right-aligned text in footer row, optional, understands markdown
 
 [Params.widgets]
   recent_num = 5 # Set the number of articles in the "Recent articles" widget
@@ -167,6 +169,7 @@ menu: main # Optional, add page to a menu. Options: main, side, footer
 
 # Theme-Defined params
 thumbnail: "img/placeholder.jpg" # Thumbnail image
+thumbnail_alt: "Thumbnail" # alt text for thumbnail image, be screen reader friendly!
 thumbnail_hide_post: false # Hide thumbnail on single post view
 lead: "Example lead - highlighted near the title" # Lead text
 authorbox: true # Enable authorbox for specific page
@@ -178,6 +181,10 @@ widgets: # Enable sidebar widgets in given order per page
   - "recent"
   - "taglist"
 sitemap_hide: false # Do not add this page to the sitemap
+scripts_head: # optional: include some literal <head> matter, e.g. for page-specific JS imports; safeHTML-filtered
+  - "<!-- -->"
+scripts_body: # optional: include some literal html just before <body/> tag, e.g. JS initialization; safeHTML-filtered
+  - "<!-- -->"
 ---
 ```
 
@@ -242,7 +249,7 @@ your `config.toml`. Here is an example.
 
 **Note:** You need to put your icon file in `layouts/partials` directory under your
 project's root if you want to display an icon of your social link. The `icon`
-filed, which is optional, should be a path relative to `layouts/partials`.
+field, which is optional, should be a path relative to `layouts/partials`.
 
 **Note:** *Only* SVG files are supported to be used as custom social icons in the current
 version. If you use any files of another format, PNG for example, a compile
diff --git a/exampleSite/config.toml b/exampleSite/config.toml
index cc55b8e..f83a2c2 100644
--- a/exampleSite/config.toml
+++ b/exampleSite/config.toml
@@ -49,6 +49,7 @@ theme = "hugo-dpsg"
 
 [Params.footer]
   text = "[Imprint and Privacy](/imprint)" # Extra text in footer row, understands markdown
+  right = "Donate!" # Right-aligned text in footer row, understands markdown
 
 # Custom menu items, normally controlled via front matter in /content files
 [menu]
diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
index a31842e..0470892 100644
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@@ -19,38 +19,43 @@
 
 	{{ $style := resources.Get "css/style.css" | resources.ExecuteAsTemplate "css/style.css" . -}}
 	<link rel="stylesheet" href="{{ $style.RelPermalink }}">
-	{{ range .Site.Params.customCSS -}}
-	<link rel="stylesheet" href="{{ . | relURL }}">
+	{{- range .Site.Params.customCSS }}
+		<link rel="stylesheet" href="{{ . | relURL }}">
+	{{- end }}
+	{{- range .Params.customCSS }}
+		<link rel="stylesheet" href="{{ . | relURL }}">
 	{{- end }}
 
 	{{- with .OutputFormats.Get "rss" }}
-	{{ printf `<link rel="%s" type="%s" href="%s" title="%s">` .Rel .MediaType.Type .RelPermalink $.Site.Title | safeHTML }}
+		{{ printf `<link rel="%s" type="%s" href="%s" title="%s">` .Rel .MediaType.Type .RelPermalink $.Site.Title | safeHTML }}
 	{{- end }}
 
-	<link rel="shortcut icon" href="{{ "favicon.ico" | absURL }}">
+	{{ partial "favicon" . }}
+	{{ partial "perpagehead" . }}
 	{{- if not .Site.IsServer }}
 		{{ template "_internal/google_analytics_async.html" . }}
 	{{- end }}
 </head>
 <body class="body">
-		{{ partial "header" . }}
-		<div class="container wrapper flex">
-			<div class="primary">
-			{{ block "main" . }}
-				{{ with .Content }}
-				<div class="content main__content clearfix">
-					{{ . }}
-				</div>
-				{{ end }}
-			{{ end }}
+	{{ partial "header" . }}
+	<div class="container wrapper flex">
+		<div class="primary">
+		{{ block "main" . }}
+			{{ with .Content }}
+			<div class="content main__content clearfix">
+				{{ . }}
 			</div>
-			{{ partial "sidebar.html" . }}
+			{{ end }}
+		{{ end }}
 		</div>
-		{{ partial "footer" . }}
-<script async defer src="{{ "js/menu.js" | relURL }}"></script>
-{{ range .Site.Params.customJS -}}
-<script src="{{ . | relURL }}"></script>
-{{- end }}
-{{ with .Site.Params.customPartial }}{{ partial . }}{{ end }}
+		{{ partial "sidebar.html" . }}
+	</div>
+	{{ partial "footer" . }}
+	<script async defer src="{{ "js/menu.js" | relURL }}"></script>
+	{{ range .Site.Params.customJS -}}
+		<script src="{{ . | relURL }}"></script>
+	{{- end }}
+	{{ with .Site.Params.customPartial }}{{ partial . }}{{ end }}
+	{{ partial "perpagebody" . }}
 </body>
 </html>
diff --git a/layouts/_default/summary.html b/layouts/_default/summary.html
index 0b4d834..45e4093 100644
--- a/layouts/_default/summary.html
+++ b/layouts/_default/summary.html
@@ -19,9 +19,12 @@
 		<div class="list__meta meta">{{ . }}</div>
 		{{- end }}
 	</header>
+	{{- if eq .Params.summary "" }}
+	{{- else }}
 	<div class="content list__excerpt post__content clearfix">
 		{{ .Summary }}
 	</div>
+	{{- end }}
 	{{- if .Site.Params.readmore }}
 	{{- if .Truncated }}
 	<div class="list__footer clearfix">
@@ -29,4 +32,4 @@
 	</div>
 	{{- end }}
 	{{- end }}
-</article>
-\ No newline at end of file
+</article>
diff --git a/layouts/index.html b/layouts/index.html
index 2c9d308..c98cf58 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -19,8 +19,8 @@
 					<p class="warning__tip">{{ T "noposts_warning_tip" | safeHTML }}</p>
 				</div>
 			</div>
-		{{ end }}
-	</main>
-	{{ partial "pagination.html" . }}
-	{{ end }}
+		{{- end }}
+		{{ partial "pagination.html" . }}
+	{{- end }}
+</main>
 {{ end }}
diff --git a/layouts/partials/favicon.html b/layouts/partials/favicon.html
new file mode 100644
index 0000000..e3b3c7e
--- /dev/null
+++ b/layouts/partials/favicon.html
@@ -0,0 +1 @@
+<link rel="shortcut icon" href="{{ "favicon.ico" | absURL }}">
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
index 95d9ac4..5f7b32f 100644
--- a/layouts/partials/footer.html
+++ b/layouts/partials/footer.html
@@ -6,5 +6,6 @@
 			<span class="footer__copyright-credits">{{ T "footer_credits" | safeHTML }}</span>
 			{{ with .Site.Params.footer.text }}<span>{{ . | markdownify }}</span>{{ end }}
 		</div>
+		{{ partial "footer_right.html" . }}
 	</div>
 </footer>
diff --git a/layouts/partials/footer_right.html b/layouts/partials/footer_right.html
new file mode 100644
index 0000000..3d01ea6
--- /dev/null
+++ b/layouts/partials/footer_right.html
@@ -0,0 +1,3 @@
+{{- with .Site.Params.footer.right }}
+<div class="footer__copyright">{{ . | markdownify }}</div>
+{{- end }}
diff --git a/layouts/partials/logo.html b/layouts/partials/logo.html
index b7566c2..cb98942 100644
--- a/layouts/partials/logo.html
+++ b/layouts/partials/logo.html
@@ -1,6 +1,7 @@
 {{- $logoTitle := .Site.Params.logo.title | default .Site.Title -}}
 {{- $logoSubtitle := .Site.Params.logo.subtitle | default .Site.Params.subtitle -}}
 {{- $logoImage := .Site.Params.logo.image -}}
+{{- $logoAlt := .Site.Params.logo.image_alt -}}
 
 {{- if or $logoTitle $logoImage }}
 	{{/* Defined when logo is mixed (image + text) */}}
@@ -11,7 +12,7 @@
 			<a class="logo__link" href="{{ "" | relLangURL }}"{{ with $logoTitle }} title="{{ . }}"{{ end }} rel="home">
 				{{ with $logoImage -}}
 					<div class="logo__item logo__imagebox">
-						<img class="logo__img" src="{{ . | relURL }}">
+						<img class="logo__img" src="{{ . | relURL }}"{{ with $logoAlt }} alt="{{ . }}"{{ end }}>
 					</div>
 				{{- end -}}
 				{{ with $logoTitle -}}
diff --git a/layouts/partials/perpagebody.html b/layouts/partials/perpagebody.html
new file mode 100644
index 0000000..992fffb
--- /dev/null
+++ b/layouts/partials/perpagebody.html
@@ -0,0 +1,5 @@
+	{{- with .Params.scripts_body -}}
+		{{- range . -}}
+			{{- . | safeHTML -}}
+		{{- end -}}
+	{{- end -}}
+\ No newline at end of file
diff --git a/layouts/partials/perpagehead.html b/layouts/partials/perpagehead.html
new file mode 100644
index 0000000..9a2edc4
--- /dev/null
+++ b/layouts/partials/perpagehead.html
@@ -0,0 +1,5 @@
+	{{- with .Params.scripts_head -}}
+		{{- range . -}}
+			{{- . | safeHTML -}}
+		{{- end -}}
+	{{- end -}}
+\ No newline at end of file
author	Matthias Gärtner <g@rtner.de>	2021-06-13 16:07:32 +0300
committer	GitHub <noreply@github.com>	2021-06-13 16:07:32 +0300
commit	ee351229a7db5022d3cec810d5565a4fdd3b9d1d (patch)
tree	f282343023df53042117216adc943387a6064de7
parent	6c632cb513f40104f68fff76bb0732083c3195fc (diff)