slight adjustments to og:image logic

This commit is contained in:
Wouter Groeneveld 2021-06-15 17:56:08 +02:00
parent 04309dcb03
commit b4298197a1
1 changed files with 25 additions and 29 deletions

View File

@ -1,6 +1,8 @@
{{ $perm := .Permalink }}
{{ $logo := "img/avatar-icon.png" }}
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="canonical" href="{{ .Permalink }}">
<link rel="canonical" href="{{ $perm }}">
<link rel="me" title="Mastodon" href="{{ .Site.Author.mastodonlink }}" />
<link rel="me" title="Github" href="{{ .Site.Author.githublink }}" />
<link rel="author" href="{{ .Site.BaseURL }}humans.txt" type="text/plain" />
@ -11,8 +13,8 @@
{{ $isHomePage := eq .Title .Site.Title }}
{{ if .Params.subtitle }}
<meta name="description" content="{{.Title}}. {{ .Params.subtitle }}. {{ .Summary | safeHTML }}">
<meta content="{{ .Title }} - {{ .Params.subtitle }}" property="og:title">
<meta content="{{ .Summary | safeHTML }}" property="og:description">
<meta name="twitter:title" content="{{ .Title }} - {{ .Params.subtitle }}" property="og:title">
<meta name="twitter:description" content="{{ .Summary | safeHTML }}" property="og:description">
{{ else }}
<meta name="description" content="{{ .Title }}{{ if eq $isHomePage false }} - {{ .Site.Title }}{{ end }}">
<meta content="{{ .Title }}{{ if eq $isHomePage false }} - {{ .Site.Title }}{{ end }}" property="og:title">
@ -23,19 +25,22 @@
<meta content="{{ delimit .Params.tags ", " }}" name="keywords">
{{ end }}
<meta property="og:url" content="{{ .Permalink }}" />
<meta name="twitter:card" content="summary_large_image">
<meta property="og:url" content="{{ $perm }}" />
<meta property="og:type" content="{{ if .Params.type }}{{ .Params.type }}{{ else }}website{{ end }}" />
{{ $thumb := $logo | absURL }}
{{ if .Params.bigimg }}
{{- $image := resources.Get (printf "%s%s" "bigimg/" .Params.bigimg ) -}}
{{ if eq $image nil }}
{{ else }}
{{- $imgsmall := $image.Resize "768x jpg q70" }}
{{ $thumb = $imgsmall.Permalink }}
{{- $imgmedium := $image.Resize "960x jpg q85" }}
<meta property="og:image" content="{{ $imgsmall.RelPermalink }}" />
<meta property="og:image:width" content="{{ $imgsmall.Width }}" />
<meta property="og:image:height" content="{{ $imgsmall.Height }}" />
<meta property="og:image:height" content="{{ $imgsmall.Height }}" />
<style>
.big-img {
background-image: url({{ $imgsmall.RelPermalink }}) !important;
@ -52,13 +57,22 @@
}
</style>
{{ end }}
{{ else }}
{{ $match := findRE `!\[\]\((.+).jpg` .RawContent 1 }}
{{ range $match }}
{{ $relthumb := replace . "![](" "" }}
{{ $thumb = printf "%s%s" $perm $relthumb }}
{{ end }}
{{ end }}
<meta name="twitter:image" property="og:image" content="{{ $thumb }}" />
<meta name="twitter:image:alt" content="{{ .Params.subtitle }}">
<!-- zie sidebar.html, zelfde logica gebruikt -->
{{ $related := first 3 (where (where (where .Site.Pages.ByDate.Reverse ".Type" "==" "post") ".Params.tags" "intersect" .Params.tags) "Permalink" "!=" .Permalink) }}
{{ $related := first 3 (where (where (where .Site.Pages.ByDate.Reverse ".Type" "==" "post") ".Params.tags" "intersect" .Params.tags) "Permalink" "!=" $perm) }}
{{ if $related }}
{{ range $related }}
<meta property="og:see_also" content="{{ .Permalink }}" />
<meta property="og:see_also" content="{{ $perm }}" />
{{ end }}
{{ end }}
<meta property="article:published_time" content="{{ .PublishDate }}" />
@ -71,7 +85,6 @@
<!-- structured data -->
{{ $ISO8601 := "2006-01-02T15:04:05-07:00" }}
{{ $logo := "img/avatar-icon.png" }}
<script type="application/ld+json">
{
"@context" : "http://schema.org",
@ -94,12 +107,7 @@
"inLanguage" : "en-US",
{{ end }}
"isFamilyFriendly": "true",
{{ if .Params.bigimg }}
{{- $image := printf "%s%s" "bigimg/" .Params.bigimg -}}
"image": {{ $image | absURL }},
{{ else }}
"image": {{ $logo | absURL }},
{{ end }}
"image": {{ $thumb }},
"author" : {
"@type": "Person",
"name": "{{ .Site.Author.name }}"
@ -125,20 +133,8 @@
"dateCreated": {{ .Date.Format $ISO8601 }},
"datePublished": {{ .PublishDate.Format $ISO8601 }},
"dateModified": {{ .Lastmod.Format $ISO8601 }},
"url" : {{ .Permalink }},
"url" : {{ $perm }},
"wordCount" : "{{ .WordCount }}",
"keywords" : [ {{ if isset .Params "tags" }}{{ range .Params.tags }}{{ . }},{{ end }}{{ end }}{{ .Title }}, {{ .Section }} ]
}
</script>
<!-- twitter cards -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="{{ .Title }}">
<meta name="twitter:description" content="{{ if .Description }}{{ .Description }}{{ else }}{{if .IsPage}}{{ .Summary }}{{ end }}{{ end }}">
{{ if .Params.bigimg }}
{{- $image := printf "%s%s" "bigimg/" .Params.bigimg -}}
<meta name="twitter:image" content="{{ $image | absURL }}">
{{ else }}
<meta name="twitter:image" content="{{ $logo | absURL }}">
{{ end }}
<meta name="twitter:image:alt" content="{{ .Params.subtitle }}">