Verbeteren zaken rondom social media (OpenGraph, Twitter, etc)

This commit is contained in:
Michael Boelen 2023-05-21 15:23:29 +02:00
parent c73bfad543
commit 8aa5670477
7 changed files with 93 additions and 5 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 58 KiB

View file

Binary file not shown.

View file

@ -5,12 +5,12 @@
<title>{{ if eq .IsHome true }}{{ .Site.Title }}{{ else }}{{ .Title }} | {{ .Site.Title }}{{ end }}</title>
<meta name="description" content="{{ if ne .Description "" }}{{ .Description }}{{ else }}{{ .Site.Params.description }}{{ end }}">
<!-- Social media -->
{{ template "_internal/opengraph.html" . }}
{{ template "_internal/twitter_cards.html" . }}
{{ partial "opengraph/opengraph.html" . }}
{{ partial "opengraph/twitter_cards.html" . }}
<link rel="canonical" href="{{ .Permalink }}">
<link rel="icon" href="{{ absURL "assets/favicon.ico" }}">
<link rel="alternate" type="application/atom+xml" title="{{ .Site.Title }}" href="{{ absURL "atom.xml" }}" />
<link rel="alternate" type="application/json" title="{{ .Site.Title }}" href="{{ absURL "feed.json" }}" />
<link rel="alternate" type="application/atom+xml" title="{{ .Site.Title }}" href="{{ absURL "atom.xml" }}">
<link rel="alternate" type="application/json" title="{{ .Site.Title }}" href="{{ absURL "feed.json" }}">
<link rel="shortcut icon" type="image/png" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNk+A8AAQUBAScY42YAAAAASUVORK5CYII=">
{{ partialCached "style.html" . }}

View file

@ -0,0 +1,24 @@
{{ $images := $.Resources.ByType "image" }}
{{ $featured := $images.GetMatch "*feature*" }}
{{ if not $featured }}{{ $featured = $images.GetMatch "{*cover*,*thumbnail*}" }}{{ end }}
{{ if not $featured }}
{{ $featured = resources.Get "/opengraph/background.png" }}
{{ $size := 80 }}
{{ $title := $.LinkTitle }}
{{ if gt (len $title) 20 }}
{{ $size = 70 }}
{{ end }}
{{ $text := $title }}
{{ $textOptions := dict
"color" "#1D3160"
"size" $size
"lineSpacing" 10
"x" 65 "y" 80
"font" (resources.Get "/opengraph/mulish-black.ttf")
}}
{{ $featured = $featured | images.Filter (images.Text $text $textOptions) }}
{{ end }}
{{ return $featured }}

View file

@ -0,0 +1,42 @@
<meta property="og:title" content="{{ .Title }}">
<meta property="og:description" content="{{ with .Description }}{{ . }}{{ else }}{{if .IsPage}}{{ .Summary }}{{ else }}{{ with .Site.Params.description }}{{ . }}{{ end }}{{ end }}{{ end }}">
<meta property="og:type" content="{{ if .IsPage }}article{{ else }}website{{ end }}">
<meta property="og:url" content="{{ .Permalink }}">
{{- with $.Params.images -}}
{{- range first 6 . }}<meta property="og:image" content="{{ . | absURL }}">{{ end -}}
{{- else -}}
{{- $featured := partial "opengraph/get-featured-image.html" . }}
{{- with $featured -}}
<meta property="og:image" content="{{ $featured.Permalink }}">
{{- else -}}
{{- with $.Site.Params.images }}<meta property="og:image" content="{{ index . 0 | absURL }}">{{ end -}}
{{- end -}}
{{- end -}}
{{- if .IsPage }}
{{- $iso8601 := "2006-01-02T15:04:05-07:00" -}}
<meta property="article:section" content="{{ .Section }}">
{{ with .PublishDate }}<meta property="article:published_time" {{ .Format $iso8601 | printf "content=%q" | safeHTMLAttr }}>{{ end }}
{{ with .Lastmod }}<meta property="article:modified_time" {{ .Format $iso8601 | printf "content=%q" | safeHTMLAttr }}>{{ end }}
{{- end -}}
{{- with .Params.audio }}<meta property="og:audio" content="{{ . }}">{{ end }}
{{- with .Params.locale }}<meta property="og:locale" content="{{ . }}">{{ end }}
{{- with .Site.Params.title }}<meta property="og:site_name" content="{{ . }}">{{ end }}
{{- with .Params.videos }}{{- range . }}
<meta property="og:video" content="{{ . | absURL }}">
{{ end }}{{ end }}
{{- /* If it is part of a series, link to related articles */}}
{{- $permalink := .Permalink }}
{{- $siteSeries := .Site.Taxonomies.series }}
{{ with .Params.series }}{{- range $name := . }}
{{- $series := index $siteSeries ($name | urlize) }}
{{- range $page := first 6 $series.Pages }}
{{- if ne $page.Permalink $permalink }}<meta property="og:see_also" content="{{ $page.Permalink }}">{{ end }}
{{- end }}
{{ end }}{{ end }}
{{- /* Facebook Page Admin ID for Domain Insights */}}
{{- with .Site.Social.facebook_admin }}<meta property="fb:admins" content="{{ . }}">{{ end }}

View file

@ -0,0 +1,22 @@
{{- with $.Params.images -}}
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:image" content="{{ index . 0 | absURL }}">
{{ else -}}
{{- $featured := partial "opengraph/get-featured-image.html" . }}
{{- with $featured -}}
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:image" content="{{ $featured.Permalink }}">
{{- else -}}
{{- with $.Site.Params.images -}}
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:image" content="{{ index . 0 | absURL }}">
{{ else -}}
<meta name="twitter:card" content="summary"/>
{{- end -}}
{{- end -}}
{{- end }}
<meta name="twitter:title" content="{{ .Title }}">
<meta name="twitter:description" content="{{ with .Description }}{{ . }}{{ else }}{{if .IsPage}}{{ .Summary }}{{ else }}{{ with .Site.Params.description }}{{ . }}{{ end }}{{ end }}{{ end -}}">
{{ with .Site.Social.twitter -}}
<meta name="twitter:site" content="@{{ . }}">
{{ end -}}