add meta tags and social image (#4)

subvisual · Mar 3, 2023 · 40d6f75 · 40d6f75
1 parent e238b4c
commit 40d6f75
Show file tree

Hide file tree

Showing 3 changed files with 49 additions and 10 deletions.
diff --git a/public/social-image.png b/public/social-image.png
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
@@ -1,9 +1,7 @@
 ---
-export interface Props {
-  title: string;
-}
-
-const { title } = Astro.props;
+import image from "/social-image.png";
+const description = "FVM event indexer";
+const title = "Dora, the TipsetExplorer";
 ---
 
 <!DOCTYPE html>
@@ -12,19 +10,60 @@ const { title } = Astro.props;
     <meta charset="UTF-8" />
     <meta
       name="viewport"
-      content="width=device-width"
+      content="width=device-width, initial-scale=1.0"
+    />
+    <meta
+      name="generator"
+      content={Astro.generator}
     />
     <link
       rel="icon"
       type="image/svg+xml"
       href="/favicon.svg"
     />
+    <title>Dora, the TipsetExplorer</title>
     <meta
-      name="generator"
-      content={Astro.generator}
+      name="description"
+      content={description}
+    />
+    <meta
+      name="keywords"
+      content="tipset, fvm, fevm, event indexer, filecoin, blockchain, handlers"
+    />
+    <meta
+      name="og:title"
+      content={title}
+    />
+    <meta
+      name="og:description"
+      content="Crypto pension fund"
+    />
+    <meta
+      name="og:image"
+      content={image}
+    />
+    <meta
+      property="og:title"
+      content={title}
+    />
+    <meta
+      name="twitter:title"
+      content={title}
+    />
+    <meta
+      name="twitter:description"
+      content={description}
+    />
+    <meta
+      name="twitter:image"
+      content={image}
+    />
+    <meta
+      name="twitter:card"
+      content="summary_large_image"
     />
-    <title>{title}</title>
   </head>
+
   <body class="bg-black text-white font-poppins antialiased selection:bg-[rgba(254,216,102,0.7)]">
     <slot />
   </body>

diff --git a/src/pages/index.astro b/src/pages/index.astro
@@ -6,7 +6,7 @@ import Layout from "../layouts/Layout.astro";
 import "../styles/global.css";
 ---
 
-<Layout title="Dora, the TipsetExplorer">
+<Layout>
   <Header />
   <main class="px-4 sm:px-16">
     <Hero />