src/components/BaseHead.astro 2.3 K raw
1
---
2
import type { SiteMeta } from "@/data/siteMeta";
3
import siteConfig from "@/site-config";
4
import "../styles/global.css";
5
6
type Props = SiteMeta;
7
8
const { title, description, ogImage, articleDate } = Astro.props;
9
10
const titleSeparator = "•";
11
const siteTitle = `${title} ${titleSeparator} ${siteConfig.title}`;
12
const canonicalURL = new URL(Astro.url.pathname, Astro.site);
13
const socialImageURL = new URL(ogImage ? ogImage : "/social-card.png", Astro.url).href;
14
15
---
16
<meta charset="utf-8" />
17
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no" />
18
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
19
20
<!-- Icons / Favicon -->
21
<link rel="icon" href="/favicon.ico" sizes="any" />
22
<link rel="icon" href="/icon.svg" type="image/svg+xml" />
23
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />
24
<link rel="manifest" href="/manifest.webmanifest" />
25
<link rel="canonical" href={canonicalURL} />
26
27
<!-- Primary Meta Tags -->
28
<title>{siteTitle}</title>
29
<meta name="title" content={siteTitle} />
30
<meta name="description" content={description} />
31
<meta name="author" content={siteConfig.author} />
32
33
<!-- Theme Colour -->
34
<meta name="theme-color" content={siteConfig.themeColorLight} />
35
36
<!-- Open Graph / Facebook -->
37
<meta property="og:type" content={articleDate ? "article" : "website"} />
38
<meta property="og:title" content={title} />
39
<meta property="og:description" content={description} />
40
<meta property="og:url" content={canonicalURL} />
41
<meta property="og:site_name" content={siteConfig.title} />
42
<meta property="og:locale" content={siteConfig.ogLocale} />
43
<meta property="og:image" content={socialImageURL} />
44
<meta property="og:image:width" content="1200" />
45
<meta property="og:image:height" content="630" />
46
{
47
	articleDate && (
48
		<>
49
			<meta property="article:author" content={siteConfig.author} />
50
			<meta property="article:published_time" content={articleDate} />
51
		</>
52
	)
53
}
54
55
<!-- Twitter -->
56
<meta property="twitter:card" content="summary_large_image" />
57
<meta property="twitter:url" content={canonicalURL} />
58
<meta property="twitter:title" content={title} />
59
<meta property="twitter:description" content={description} />
60
<meta property="twitter:image" content={socialImageURL} />
61
62
<!-- RSS auto-discovery -->
63
<link rel="alternate" type="application/rss+xml" title={siteConfig.title} href="/rss.xml" />