diff options
Diffstat (limited to 'examples/with-content/src/components/BaseHead.astro')
| -rw-r--r-- | examples/with-content/src/components/BaseHead.astro | 38 |
1 files changed, 38 insertions, 0 deletions
diff --git a/examples/with-content/src/components/BaseHead.astro b/examples/with-content/src/components/BaseHead.astro new file mode 100644 index 000000000..ce60a7e77 --- /dev/null +++ b/examples/with-content/src/components/BaseHead.astro @@ -0,0 +1,38 @@ +--- +// Import the global.css file here so that it is included on +// all pages through the use of the <BaseHead /> component. +import '../styles/global.css'; + +export interface Props { + title: string; + description: string; + image?: string; +} + +const { title, description, image = '/placeholder-social.jpg' } = Astro.props; +--- + +<!-- Global Metadata --> +<meta charset="utf-8" /> +<meta name="viewport" content="width=device-width,initial-scale=1" /> +<link rel="icon" type="image/svg+xml" href="/favicon.svg" /> +<meta name="generator" content={Astro.generator} /> + +<!-- Primary Meta Tags --> +<title>{title}</title> +<meta name="title" content={title} /> +<meta name="description" content={description} /> + +<!-- Open Graph / Facebook --> +<meta property="og:type" content="website" /> +<meta property="og:url" content={Astro.url} /> +<meta property="og:title" content={title} /> +<meta property="og:description" content={description} /> +<meta property="og:image" content={new URL(image, Astro.url)} /> + +<!-- Twitter --> +<meta property="twitter:card" content="summary_large_image" /> +<meta property="twitter:url" content={Astro.url} /> +<meta property="twitter:title" content={title} /> +<meta property="twitter:description" content={description} /> +<meta property="twitter:image" content={new URL(image, Astro.url)} /> |