From 5001b28387cc9bc7ae0e592856d90ac53a8328e3 Mon Sep 17 00:00:00 2001
From: Sean <iUnknwn@users.noreply.github.com>
Date: Tue, 23 Jun 2020 13:34:09 +0000
Subject: [PATCH] Add automatic cover image support (#303)
---
layouts/partials/page-header.html | 2 +-
layouts/post/summary-with-image.html | 7 ++++---
layouts/partials/summary-with-image.html | 6 +++---
layouts/partials/func/GetFeaturedImage.html | 35 +++++++++++++++++++++++++++++++++++
4 files changed, 43 insertions(+), 7 deletions(-)
diff --git a/layouts/partials/func/GetFeaturedImage.html b/layouts/partials/func/GetFeaturedImage.html
new file mode 100644
index 0000000..c00b086
--- /dev/null
+++ b/layouts/partials/func/GetFeaturedImage.html
@@ -0,0 +1,35 @@
+{{/*
+ GetFeaturedImage
+
+ This partial gets the url for featured image for a given page.
+
+ If a featured_image was set in the page's front matter, then that will be used.
+
+ If not set, this will search page resources to find an image that contains the word
+ "cover", and if found, returns the path to that resource.
+
+ If no featured_image was set, and there's no "cover" image in page resources, then
+ this partial returns an empty string (which evaluates to false).
+
+ @return Permalink to featured image, or an empty string if not found.
+
+*/}}
+
+{{/* Declare a new string variable, $linkToCover */}}
+{{ $linkToCover := "" }}
+
+{{/* Use the value from front matter if present */}}
+{{ if .Params.featured_image }}
+ {{ $linkToCover = .Params.featured_image }}
+
+{{/* Find the first image with 'cover' in the name in this page bundle. */}}
+{{ else }}
+ {{ $img := (.Resources.ByType "image").GetMatch "*cover*" }}
+ {{ with $img }}
+ {{ $linkToCover = .Permalink }}
+ {{ end }}
+{{ end }}
+
+{{/* return either a permalink, or an empty string. Note that partials can only have a single
+return statement, so this needs to be at the end of the partial (and not in the if block) */}}
+{{ return $linkToCover }}
\ No newline at end of file
diff --git a/layouts/partials/page-header.html b/layouts/partials/page-header.html
index 8cd6d4f..9f2ebd5 100644
--- a/layouts/partials/page-header.html
+++ b/layouts/partials/page-header.html
@@ -1,4 +1,4 @@
-{{ $featured_image := .Params.featured_image }}
+{{ $featured_image := partial "func/GetFeaturedImage.html" . }}
{{ if $featured_image }}
{{/* Trimming the slash and adding absURL make sure the image works no matter where our site lives */}}
{{ $featured_image := (trim $featured_image "/") | absURL }}
diff --git a/layouts/partials/summary-with-image.html b/layouts/partials/summary-with-image.html
index 962981f..702a305 100644
--- a/layouts/partials/summary-with-image.html
+++ b/layouts/partials/summary-with-image.html
@@ -1,8 +1,8 @@
-{{ $featured_image := .Params.featured_image }}
+{{ $featured_image := partial "func/GetFeaturedImage.html" . }}
<article class="bb b--black-10">
<div class="db pv4 ph3 ph0-l no-underline dark-gray">
<div class="flex flex-column flex-row-ns">
- {{ if .Params.featured_image }}
+ {{ if $featured_image }}
{{/* Trimming the slash and adding absURL make sure the image works no matter where our site lives */}}
{{ $featured_image := (trim $featured_image "/") | absURL }}
<div class="pr3-ns mb4 mb0-ns w-100 w-40-ns">
@@ -11,7 +11,7 @@
</a>
</div>
{{ end }}
- <div class="blah w-100{{ if .Params.featured_image }} w-60-ns pl3-ns{{ end }}">
+ <div class="blah w-100{{ if $featured_image }} w-60-ns pl3-ns{{ end }}">
<h1 class="f3 fw1 athelas mt0 lh-title">
<a href="{{.Permalink}}" class="color-inherit dim link">
{{ .Title }}
diff --git a/layouts/post/summary-with-image.html b/layouts/post/summary-with-image.html
index bd74fd4..3afac67 100644
--- a/layouts/post/summary-with-image.html
+++ b/layouts/post/summary-with-image.html
@@ -1,12 +1,13 @@
<article class="bb b--black-10">
<a class="db pv4 ph3 ph0-l no-underline dark-gray dim" href="{{ .Permalink }}">
<div class="flex flex-column flex-row-ns">
- {{ if .Params.featured_image }}
+ {{ $featured_image := partial "func/GetFeaturedImage.html" . }}
+ {{ if $featured_image }}
<div class="pr3-ns mb4 mb0-ns w-100 w-40-ns">
- <img src="{{ .Params.featured_image }}" class="db" alt="image from {{ .Title }}">
+ <img src="{{ $featured_image }}" class="db" alt="image from {{ .Title }}">
</div>
{{ end }}
- <div class="w-100{{ if .Params.featured_image }} w-60-ns pl3-ns{{ end }}">
+ <div class="w-100{{ if $featured_image }} w-60-ns pl3-ns{{ end }}">
<h1 class="f3 fw1 athelas mt0 lh-title">{{ .Title }}</h1>
<div class="f6 f5-l lh-copy nested-copy-line-height">
{{ .Summary }}
--
Gitblit v1.10.0