diff options
Diffstat (limited to 'examples/blog/src/components/BaseHead.astro')
| -rw-r--r-- | examples/blog/src/components/BaseHead.astro | 27 |
1 files changed, 11 insertions, 16 deletions
diff --git a/examples/blog/src/components/BaseHead.astro b/examples/blog/src/components/BaseHead.astro index af6fd380b..9c4c8fcdf 100644 --- a/examples/blog/src/components/BaseHead.astro +++ b/examples/blog/src/components/BaseHead.astro @@ -1,19 +1,21 @@ --- -import '../styles/blog.css'; +// 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 canonicalURL = new URL(Astro.url.pathname, Astro.site); -const { title, description } = Astro.props; +const { title, description, image = '/placeholder-social.jpg' } = Astro.props; --- <!-- Global Metadata --> <meta charset="utf-8" /> -<meta name="viewport" content="width=device-width" /> -<link rel="icon" type="image/x-icon" href="/favicon.ico" /> +<meta name="viewport" content="width=device-width,initial-scale=1" /> +<link rel="icon" type="image/svg+xml" href="/astro.svg" /> <meta name="generator" content={Astro.generator} /> <!-- Primary Meta Tags --> @@ -23,21 +25,14 @@ const { title, description } = Astro.props; <!-- Open Graph / Facebook --> <meta property="og:type" content="website" /> -<meta property="og:url" content={canonicalURL} /> +<meta property="og:url" content={Astro.url} /> <meta property="og:title" content={title} /> <meta property="og:description" content={description} /> -<meta property="og:image" content="https://astro.build/social.png" /> +<meta property="og:image" content={new URL(image, Astro.url)} /> <!-- Twitter --> <meta property="twitter:card" content="summary_large_image" /> -<meta property="twitter:url" content={canonicalURL} /> +<meta property="twitter:url" content={Astro.url} /> <meta property="twitter:title" content={title} /> <meta property="twitter:description" content={description} /> -<meta property="twitter:image" content="https://astro.build/social.png" /> - -<!-- Fonts --> -<link rel="preconnect" href="https://fonts.gstatic.com" /> -<link - rel="stylesheet" - href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&family=IBM+Plex+Sans:wght@400;700&display=swap" -/> +<meta property="twitter:image" content={new URL(image, Astro.url)} /> |