Merge pull request #17 from GovTechSG/staging

release: refactor og tags
GovTechSG · Nov 16, 2023 · f3593e3 · f3593e3
2 parents be4f735 + ff948b6
commit f3593e3
Show file tree

Hide file tree

Showing 4 changed files with 25 additions and 3 deletions.
diff --git a/packages/app/src/pages/_app.tsx b/packages/app/src/pages/_app.tsx
@@ -18,11 +18,17 @@ const App: AppType<{ session: Session | null }> = ({ Component, pageProps }: App
         <>
             <Head>
                 <title>Purpose Bound Money (PBM) Portal</title>
-                <meta property="og:image:type" content="image/png" />
+                <meta property="og:image:type" content="website" />
                 <meta property="og:image" content="/opengraph-image.png" />
                 <meta property="og:image:width" content="1200" />
                 <meta property="og:image:height" content="630" />
-                <meta property="og:image:alt" content="Purpose Bound Money Portal" />
+                <meta property="og:image:alt" content="Purpose Bound Money (PBM) Portal" />
+                <meta property="og:title" content="Purpose Bound Money (PBM) Portal" />
+                <meta name="twitter:card" content="summary_large_image" />
+                <meta
+                    property="og:description"
+                    content="A protocol, developed as part of Project Orchid, enabling the use of digital money with automated on-chain escrow payment releases."
+                />
             </Head>
 
             <Script src={`https://www.googletagmanager.com/gtag/js?id=${gaMeasurementId}`} />

diff --git a/packages/web/app/layout.tsx b/packages/web/app/layout.tsx
@@ -36,6 +36,20 @@ export const metadata: Metadata = {
   },
   manifest: "/site.webmanifest",
   metadataBase: new URL(process.env.NEXT_PUBLIC_BASE_URL!),
+  openGraph: {
+    type: "website",
+    title: "The Purpose Bound Money (PBM)",
+    description:
+      "A protocol, developed as part of Project Orchid, enabling the use of digital money with automated on-chain escrow payment releases.",
+    images: [
+      {
+        url: "/opengraph-image.png",
+        width: 1200,
+        height: 630,
+        alt: "Purpose Bound Money (PBM)",
+      },
+    ],
+  },
 };
 
 export default function RootLayout({
@@ -48,6 +62,9 @@ export default function RootLayout({
   // noinspection HtmlRequiredTitleElement
   return (
     <html lang="en">
+      <head>
+        <meta name="twitter:card" content="summary_large_image" />
+      </head>
       <body
         className={`${inter.variable} ${architects_daughter.variable} font-inter antialiased bg-white text-gray-700 tracking-tight bg-top bg-no-repeat bg-auto bg-blend-multiply bg-page`}
       >

diff --git a/packages/web/app/opengraph-image.alt.txt b/packages/web/app/opengraph-image.alt.txt
diff --git a/packages/web/app/opengraph-image.png → packages/web/public/opengraph-image.png b/packages/web/app/opengraph-image.png → packages/web/public/opengraph-image.png