hugo-typo/layouts/_internal/opengraph.html
Sangeeth Sudheer 1cbe2066ec
Add partial to customize og:image meta property
Adds a new partial — `head/og-image.html` — that will render the value to be used
for `og:image` meta tags. The changes preserve the existing Hugo OpenGraph template's
behavior of checking and using the frontmatter or specific format of image names
as the `og:image` but if that doesn't work, it will delegate to the default partial which
uses `assets/images/og-image.{ext}` as the image.

This partial can be overriden to allow dynamic `og:image` URLs via a third-party service.

`_internal/opengraph.html` source is copied from Hugo to customize and support
this feature. Docs are updated to mention its usage.
2025-03-15 15:28:05 +05:30

94 lines
No EOL
2.9 KiB
HTML

{{- /*
Original source: https://github.com/gohugoio/hugo/blob/61c39ae63b62667d965c2ff96d085f4eda59bcb2/tpl/tplimpl/embedded/templates/opengraph.html
*/ -}}
<meta property="og:url" content="{{ .Permalink }}">
{{- with or site.Title site.Params.title | plainify }}
<meta property="og:site_name" content="{{ . }}">
{{- end }}
{{- /* Source modified to remove pipe to `plainify` */ -}}
{{- with or .Title site.Title site.Params.title }}
<meta property="og:title" content="{{ . }}">
{{- end }}
{{- with or .Description .Summary site.Params.description | plainify | htmlUnescape }}
<meta property="og:description" content="{{ trim . "\n\r\t " }}">
{{- end }}
{{- with or .Params.locale site.Language.LanguageCode }}
<meta property="og:locale" content="{{ replace . `-` `_` }}">
{{- end }}
{{- if .IsPage }}
<meta property="og:type" content="article">
{{- with .Section }}
<meta property="article:section" content="{{ . }}">
{{- end }}
{{- $ISO8601 := "2006-01-02T15:04:05-07:00" }}
{{- 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 }}
{{- range .GetTerms "tags" | first 6 }}
<meta property="article:tag" content="{{ .Page.Title | plainify }}">
{{- end }}
{{- else }}
<meta property="og:type" content="website">
{{- end }}
{{- with partial "_funcs/get-page-images" . }}
{{- range . | first 6 }}
<meta property="og:image" content="{{ .Permalink }}">
{{- end }}
{{- else -}}
{{- /*
Source modified to load `assets/images/og-image.{webp,png,jpg}` files if any of them exists.
og-image.html can be modified in Hugo project if custom image generation logic is desired such
as using an external service.
*/ -}}
{{- if (and (or .IsHome .IsPage) (templates.Exists "partials/head/og-image.html")) -}}
{{- $ogImage := partial "head/og-image.html" . -}}
{{- with $ogImage -}}
<meta property="og:image" content="{{ . }}">
{{- end -}}
{{- end }}
{{- end }}
{{- with .Params.audio }}
{{- range . | first 6 }}
<meta property="og:audio" content="{{ . | absURL }}">
{{- end }}
{{- end }}
{{- with .Params.videos }}
{{- range . | first 6 }}
<meta property="og:video" content="{{ . | absURL }}">
{{- end }}
{{- end }}
{{- range .GetTerms "series" }}
{{- range .Pages | first 7 }}
{{- if ne $ . }}
<meta property="og:see_also" content="{{ .Permalink }}">
{{- end }}
{{- end }}
{{- end }}
{{- with site.Params.social }}
{{- if reflect.IsMap . }}
{{- with .facebook_app_id }}
<meta property="fb:app_id" content="{{ . }}">
{{- else }}
{{- with .facebook_admin }}
<meta property="fb:admins" content="{{ . }}">
{{- end }}
{{- end }}
{{- end }}
{{- end }}