Compare commits

..

2 commits

Author SHA1 Message Date
7d162f7295 further opengraph tweaks 2024-02-16 22:29:30 -06:00
74cfda7f25 generate og:image for homepage too 2024-02-16 22:16:30 -06:00

View file

@ -1,13 +1,21 @@
{{ $base := resources.Get "og_base.png" }}
{{ $font := resources.Get "/FiraMono-Regular.ttf" }}
<meta property="og:title" content="{{ .Title }}" /> <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: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:type" content="{{ if .IsPage }}article{{ else }}website{{ end }}" />
<meta property="og:url" content="{{ .Permalink }}" /> <meta property="og:url" content="{{ .Permalink }}" />
<meta property="og:locale" content="{{ .Lang }}" /> <meta property="og:locale" content="{{ .Lang }}" />
{{- if .IsHome }} {{- if .IsHome }}
<meta property="og:type" content="website"> {{ $img := $base.Filter (images.Text .Site.Params.Description (dict
<meta property="og:image" content="{{ .Site.Params.fallBackOgImage | absURL }}" /> "color" "#d8d8d8"
{{- else }} "size" 64
<meta property="og:type" content="article"> "linespacing" 2
"x" 40
"y" 300
"font" $font
))}}
{{ $img = resources.Copy "og.png" $img }}
{{ .Scratch.Set "og_image" $img }}
{{- end }} {{- end }}
{{- if .IsPage }} {{- if .IsPage }}
@ -15,19 +23,6 @@
<meta property="article:section" content="{{ .Section }}" /> <meta property="article:section" content="{{ .Section }}" />
{{ with .PublishDate }}<meta property="article:published_time" {{ .Format $iso8601 | printf "content=%q" | safeHTMLAttr }} />{{ end }} {{ 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 }} {{ 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 .IsPage -}}
{{/* Generate opengraph image, based on https://aarol.dev/posts/hugo-og-image/ */}}
{{ $base := resources.Get "og_base.png" }}
{{ $font := resources.Get "/FiraMono-Regular.ttf"}}
{{ $img := $base.Filter (images.Text .Page.Title (dict {{ $img := $base.Filter (images.Text .Page.Title (dict
"color" "#d8d8d8" "color" "#d8d8d8"
"size" 64 "size" 64
@ -37,13 +32,21 @@
"font" $font "font" $font
))}} ))}}
{{ $img = resources.Copy (path.Join .Page.RelPermalink "og.png") $img }} {{ $img = resources.Copy (path.Join .Page.RelPermalink "og.png") $img }}
{{ .Scratch.Set "og_image" $img }}
{{- end -}}
{{ $img := .Scratch.Get "og_image" }}
<meta property="og:image" content="{{$img.Permalink}}"> <meta property="og:image" content="{{$img.Permalink}}">
<meta property="og:image:width" content="{{$img.Width}}" /> <meta property="og:image:width" content="{{$img.Width}}" />
<meta property="og:image:height" content="{{$img.Height}}" /> <meta property="og:image:height" content="{{$img.Height}}" />
<!-- Twitter metadata (used by other websites as well) -->
<meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="{{ .Title }}" /> <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 -}}"/> <meta name="twitter:description" content="{{ with .Description }}{{ . }}{{ else }}{{if .IsPage}}{{ .Summary }}{{ else }}{{ with .Site.Params.description }}{{ . }}{{ end }}{{ end }}{{ end -}}"/>
<meta name="twitter:image" content="{{$img.Permalink}}" /> <meta name="twitter:image" content="{{$img.Permalink}}" />
{{- end -}}
{{- with .Params.audio }}<meta property="og:audio" 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 }}