feat: enhance SEO meta tags and favicon support

- Add OpenGraph meta tags for social media sharing
- Add Twitter Card meta tags
- Update favicon to use favicon.ico
- Add support for custom meta tags through front matter
- Add additional SEO meta tags (author, robots, canonical)
This commit is contained in:
Chaoming Li 2024-11-19 22:38:34 +11:00
parent edd7d9844d
commit 460676e5d0

View file

@ -3,11 +3,49 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Title -->
<title>{{ if .IsHome }}{{ .Site.Title }}{{ else }}{{ .Title }} | {{ .Site.Title }}{{ end }}</title>
<!-- Meta Tags -->
<meta name="description" content="{{ with .Description }}{{ . }}{{ else }}{{ with .Site.Params.description }}{{ . }}{{ end }}{{ end }}">
<meta name="author" content="{{ .Site.Params.author | default .Site.Title }}">
<meta name="robots" content="{{ with .Params.robots }}{{ . }}{{ else }}index, follow{{ end }}">
<!-- Open Graph -->
<meta property="og:title" content="{{ if .IsHome }}{{ .Site.Title }}{{ else }}{{ .Title }} | {{ .Site.Title }}{{ end }}">
<meta property="og:description" content="{{ with .Description }}{{ . }}{{ else }}{{ with .Site.Params.description }}{{ . }}{{ end }}{{ end }}">
<meta property="og:type" content="{{ if .IsHome }}website{{ else }}article{{ end }}">
<meta property="og:url" content="{{ .Permalink }}">
<meta property="og:site_name" content="{{ .Site.Title }}">
{{ with .Params.image }}
<meta property="og:image" content="{{ . | absURL }}">
{{ else }}
{{ with .Site.Params.image }}
<meta property="og:image" content="{{ . | absURL }}">
{{ end }}
{{ end }}
<!-- Twitter Card -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="{{ if .IsHome }}{{ .Site.Title }}{{ else }}{{ .Title }} | {{ .Site.Title }}{{ end }}">
<meta name="twitter:description" content="{{ with .Description }}{{ . }}{{ else }}{{ with .Site.Params.description }}{{ . }}{{ end }}{{ end }}">
{{ with .Site.Params.twitter }}
<meta name="twitter:site" content="@{{ . }}">
{{ end }}
{{ with .Params.image }}
<meta name="twitter:image" content="{{ . | absURL }}">
{{ else }}
{{ with .Site.Params.image }}
<meta name="twitter:image" content="{{ . | absURL }}">
{{ end }}
{{ end }}
<!-- Favicon -->
<link rel="icon" type="image/png" href="{{ "favicon.png" | relURL }}">
<link rel="icon" type="image/x-icon" href="{{ "images/favicon.ico" | relURL }}">
<!-- Canonical URL -->
<link rel="canonical" href="{{ .Permalink }}">
<!-- Fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com">
@ -21,6 +59,13 @@
{{ $css = $css | minify | fingerprint | resources.PostProcess }}
{{ end }}
<link rel="stylesheet" href="{{ $css.RelPermalink }}">
<!-- Additional Meta Tags from Front Matter -->
{{ with .Params.customMeta }}
{{ range . }}
<meta {{ range $key, $value := . }} {{ $key }}="{{ $value }}"{{ end }}>
{{ end }}
{{ end }}
</head>
<body class="flex flex-col min-h-screen">
<!-- Header -->