Add open graph tags

Sitecore · Mar 28, 2024 · de5c7a8 · de5c7a8
1 parent 6749e2b
commit de5c7a8
Show file tree

Hide file tree

Showing 8 changed files with 292 additions and 41 deletions.
diff --git a/src/Project/Sugcon2024/Sugcon/src/Layout.tsx b/src/Project/Sugcon2024/Sugcon/src/Layout.tsx
@@ -3,6 +3,7 @@
  */
 import React from 'react';
 import Head from 'next/head';
+import { useRouter } from 'next/router';
 import { Placeholder, LayoutServiceData, Field, HTMLLink } from '@sitecore-jss/sitecore-jss-nextjs';
 import { Default as Header } from 'template/Header';
 import { Default as Footer } from 'template/Footer';
@@ -21,17 +22,26 @@ interface RouteFields {
   Title?: Field;
   MetaDescription?: Field;
   MetaKeywords?: Field;
+  OGTitle?: Field;
+  OGDescription?: Field;
+  OGType?: Field;
+  OGImage?: Field;
 }
 
 const Layout = ({ layoutData, headLinks }: LayoutProps): JSX.Element => {
   const { route } = layoutData.sitecore;
   const fields = route?.fields as RouteFields;
+  const origin =
+    typeof window !== 'undefined' && window.location.origin ? window.location.origin : '';
+  const router = useRouter();
+  const canonicalUrl = (origin + (router.asPath === '/' ? '' : router.asPath)).split('?')[0];
 
   return (
     <>
       <Scripts />
       <Head>
         <title>{fields?.Title?.value?.toString() || 'Page'}</title>
+
         <meta
           key="metadesc"
           name="description"
@@ -47,6 +57,12 @@ const Layout = ({ layoutData, headLinks }: LayoutProps): JSX.Element => {
           name="viewport"
           content="width=device-width, height=device-height"
         />
+        <link rel="canonical" href={canonicalUrl} />
+        <meta property="og:title" content={fields?.OGTitle?.value?.toString()} />
+        <meta property="og:url" content={canonicalUrl} />
+        <meta property="og:image" content={fields?.OGTitle?.value?.toString()} />
+        <meta property="og:type" content={fields?.OGType?.value?.toString()} />
+        <meta property="og:description" content={fields?.OGDescription?.value?.toString()} />
 
         <link rel="icon" href={`/favicon.ico`} />
 

diff --git a/src/Project/Sugcon2024/items/Templates/Sugcon2024/Base Templates/_OG Tags.yml b/src/Project/Sugcon2024/items/Templates/Sugcon2024/Base Templates/_OG Tags.yml
@@ -0,0 +1,35 @@
+---
+ID: "cb7020b6-b576-4b0d-aee2-b81e9b69507a"
+Parent: "e79946c9-16f4-46f9-987b-9fb876c1b349"
+Template: "ab86861a-6030-46c5-b394-e8f99e8b87db"
+Path: /sitecore/templates/Project/Sugcon2024/Base Templates/_OG Tags
+SharedFields:
+- ID: "12c33f3f-86c5-43a5-aeb4-5598cec45116"
+  Hint: __Base template
+  Value: "{1930BBEB-7805-471A-A3BE-4858AC7CF696}"
+Languages:
+- Language: en
+  Versions:
+  - Version: 1
+    Fields:
+    - ID: "25bed78c-4957-4165-998a-ca1b52f67497"
+      Hint: __Created
+      Value: 20240328T165840Z
+    - ID: "52807595-0f8f-4b20-8d2a-cb71d28c6103"
+      Hint: __Owner
+      Value: |
+        sitecore\UOUBIWQRx7
+    - ID: "5dd74568-4d4b-44c1-b513-0af5f4cda34f"
+      Hint: __Created by
+      Value: |
+        sitecore\UOUBIWQRx7
+    - ID: "8cdc337e-a112-42fb-bbb4-4143751e123f"
+      Hint: __Revision
+      Value: "25f83f3b-372c-4aeb-88ee-59b9fe89b200"
+    - ID: "badd9cf9-53e0-4d0c-bcc0-2d784c282f6a"
+      Hint: __Updated by
+      Value: |
+        sitecore\UOUBIWQRx7
+    - ID: "d9cf14b1-fa16-4ba6-9288-e8a174d4d522"
+      Hint: __Updated
+      Value: 20240328T165840Z
diff --git a/...Project/Sugcon2024/items/Templates/Sugcon2024/Base Templates/_OG Tags/Open Graph Tags.yml b/...Project/Sugcon2024/items/Templates/Sugcon2024/Base Templates/_OG Tags/Open Graph Tags.yml
@@ -0,0 +1,31 @@
+---
+ID: "148d2885-8c76-4bc5-865f-175b7c83b538"
+Parent: "cb7020b6-b576-4b0d-aee2-b81e9b69507a"
+Template: "e269fbb5-3750-427a-9149-7aa950b49301"
+Path: /sitecore/templates/Project/Sugcon2024/Base Templates/_OG Tags/Open Graph Tags
+Languages:
+- Language: en
+  Versions:
+  - Version: 1
+    Fields:
+    - ID: "25bed78c-4957-4165-998a-ca1b52f67497"
+      Hint: __Created
+      Value: 20240328T170229Z
+    - ID: "52807595-0f8f-4b20-8d2a-cb71d28c6103"
+      Hint: __Owner
+      Value: |
+        sitecore\UOUBIWQRx7
+    - ID: "5dd74568-4d4b-44c1-b513-0af5f4cda34f"
+      Hint: __Created by
+      Value: |
+        sitecore\UOUBIWQRx7
+    - ID: "8cdc337e-a112-42fb-bbb4-4143751e123f"
+      Hint: __Revision
+      Value: "87df6510-f38d-4281-a302-d17f3a0c8a7e"
+    - ID: "badd9cf9-53e0-4d0c-bcc0-2d784c282f6a"
+      Hint: __Updated by
+      Value: |
+        sitecore\UOUBIWQRx7
+    - ID: "d9cf14b1-fa16-4ba6-9288-e8a174d4d522"
+      Hint: __Updated
+      Value: 20240328T170635Z
diff --git a/...2024/items/Templates/Sugcon2024/Base Templates/_OG Tags/Open Graph Tags/OGDescription.yml b/...2024/items/Templates/Sugcon2024/Base Templates/_OG Tags/Open Graph Tags/OGDescription.yml
@@ -0,0 +1,42 @@
+---
+ID: "cbb2a914-81e3-4fe6-8aed-deab8ed8b98e"
+Parent: "148d2885-8c76-4bc5-865f-175b7c83b538"
+Template: "455a3e98-a627-4b40-8035-e683a0331ac7"
+Path: /sitecore/templates/Project/Sugcon2024/Base Templates/_OG Tags/Open Graph Tags/OGDescription
+SharedFields:
+- ID: "ab162cc0-dc80-4abf-8871-998ee5d7ba32"
+  Hint: Type
+  Value: "Multi-Line Text"
+- ID: "ba3f86a2-4a1c-4d78-b63d-91c2779c1b5e"
+  Hint: __Sortorder
+  Value: 200
+Languages:
+- Language: en
+  Fields:
+  - ID: "19a69332-a23e-4e70-8d16-b2640cb24cc8"
+    Hint: Title
+    Value: OG Description
+  Versions:
+  - Version: 1
+    Fields:
+    - ID: "25bed78c-4957-4165-998a-ca1b52f67497"
+      Hint: __Created
+      Value: 20240328T170229Z
+    - ID: "52807595-0f8f-4b20-8d2a-cb71d28c6103"
+      Hint: __Owner
+      Value: |
+        sitecore\UOUBIWQRx7
+    - ID: "5dd74568-4d4b-44c1-b513-0af5f4cda34f"
+      Hint: __Created by
+      Value: |
+        sitecore\UOUBIWQRx7
+    - ID: "8cdc337e-a112-42fb-bbb4-4143751e123f"
+      Hint: __Revision
+      Value: "b1200639-f4fa-4261-9081-34fe51103b92"
+    - ID: "badd9cf9-53e0-4d0c-bcc0-2d784c282f6a"
+      Hint: __Updated by
+      Value: |
+        sitecore\UOUBIWQRx7
+    - ID: "d9cf14b1-fa16-4ba6-9288-e8a174d4d522"
+      Hint: __Updated
+      Value: 20240328T172326Z
diff --git a/...Sugcon2024/items/Templates/Sugcon2024/Base Templates/_OG Tags/Open Graph Tags/OGImage.yml b/...Sugcon2024/items/Templates/Sugcon2024/Base Templates/_OG Tags/Open Graph Tags/OGImage.yml
@@ -0,0 +1,42 @@
+---
+ID: "1c75d8e4-860f-4a6f-86f5-e0868d0114f1"
+Parent: "148d2885-8c76-4bc5-865f-175b7c83b538"
+Template: "455a3e98-a627-4b40-8035-e683a0331ac7"
+Path: /sitecore/templates/Project/Sugcon2024/Base Templates/_OG Tags/Open Graph Tags/OGImage
+SharedFields:
+- ID: "ab162cc0-dc80-4abf-8871-998ee5d7ba32"
+  Hint: Type
+  Value: "Single-Line Text"
+- ID: "ba3f86a2-4a1c-4d78-b63d-91c2779c1b5e"
+  Hint: __Sortorder
+  Value: 400
+Languages:
+- Language: en
+  Fields:
+  - ID: "19a69332-a23e-4e70-8d16-b2640cb24cc8"
+    Hint: Title
+    Value: OG Image
+  Versions:
+  - Version: 1
+    Fields:
+    - ID: "25bed78c-4957-4165-998a-ca1b52f67497"
+      Hint: __Created
+      Value: 20240328T170230Z
+    - ID: "52807595-0f8f-4b20-8d2a-cb71d28c6103"
+      Hint: __Owner
+      Value: |
+        sitecore\UOUBIWQRx7
+    - ID: "5dd74568-4d4b-44c1-b513-0af5f4cda34f"
+      Hint: __Created by
+      Value: |
+        sitecore\UOUBIWQRx7
+    - ID: "8cdc337e-a112-42fb-bbb4-4143751e123f"
+      Hint: __Revision
+      Value: "50613168-53cb-474b-a8c5-ec33574012ef"
+    - ID: "badd9cf9-53e0-4d0c-bcc0-2d784c282f6a"
+      Hint: __Updated by
+      Value: |
+        sitecore\UOUBIWQRx7
+    - ID: "d9cf14b1-fa16-4ba6-9288-e8a174d4d522"
+      Hint: __Updated
+      Value: 20240328T172337Z
diff --git a/...Sugcon2024/items/Templates/Sugcon2024/Base Templates/_OG Tags/Open Graph Tags/OGTitle.yml b/...Sugcon2024/items/Templates/Sugcon2024/Base Templates/_OG Tags/Open Graph Tags/OGTitle.yml
@@ -0,0 +1,42 @@
+---
+ID: "b03cdc17-d7b5-4c87-97a9-b57352fe54a3"
+Parent: "148d2885-8c76-4bc5-865f-175b7c83b538"
+Template: "455a3e98-a627-4b40-8035-e683a0331ac7"
+Path: /sitecore/templates/Project/Sugcon2024/Base Templates/_OG Tags/Open Graph Tags/OGTitle
+SharedFields:
+- ID: "ab162cc0-dc80-4abf-8871-998ee5d7ba32"
+  Hint: Type
+  Value: "Single-Line Text"
+- ID: "ba3f86a2-4a1c-4d78-b63d-91c2779c1b5e"
+  Hint: __Sortorder
+  Value: 100
+Languages:
+- Language: en
+  Fields:
+  - ID: "19a69332-a23e-4e70-8d16-b2640cb24cc8"
+    Hint: Title
+    Value: OG Title
+  Versions:
+  - Version: 1
+    Fields:
+    - ID: "25bed78c-4957-4165-998a-ca1b52f67497"
+      Hint: __Created
+      Value: 20240328T170229Z
+    - ID: "52807595-0f8f-4b20-8d2a-cb71d28c6103"
+      Hint: __Owner
+      Value: |
+        sitecore\UOUBIWQRx7
+    - ID: "5dd74568-4d4b-44c1-b513-0af5f4cda34f"
+      Hint: __Created by
+      Value: |
+        sitecore\UOUBIWQRx7
+    - ID: "8cdc337e-a112-42fb-bbb4-4143751e123f"
+      Hint: __Revision
+      Value: "21093d4e-be65-45a0-8df3-5780515c0fbb"
+    - ID: "badd9cf9-53e0-4d0c-bcc0-2d784c282f6a"
+      Hint: __Updated by
+      Value: |
+        sitecore\UOUBIWQRx7
+    - ID: "d9cf14b1-fa16-4ba6-9288-e8a174d4d522"
+      Hint: __Updated
+      Value: 20240328T172320Z
diff --git a/.../Sugcon2024/items/Templates/Sugcon2024/Base Templates/_OG Tags/Open Graph Tags/OGType.yml b/.../Sugcon2024/items/Templates/Sugcon2024/Base Templates/_OG Tags/Open Graph Tags/OGType.yml
@@ -0,0 +1,42 @@
+---
+ID: "600a8e16-3dc3-4075-9edc-8a63d7a20216"
+Parent: "148d2885-8c76-4bc5-865f-175b7c83b538"
+Template: "455a3e98-a627-4b40-8035-e683a0331ac7"
+Path: /sitecore/templates/Project/Sugcon2024/Base Templates/_OG Tags/Open Graph Tags/OGType
+SharedFields:
+- ID: "ab162cc0-dc80-4abf-8871-998ee5d7ba32"
+  Hint: Type
+  Value: "Single-Line Text"
+- ID: "ba3f86a2-4a1c-4d78-b63d-91c2779c1b5e"
+  Hint: __Sortorder
+  Value: 300
+Languages:
+- Language: en
+  Fields:
+  - ID: "19a69332-a23e-4e70-8d16-b2640cb24cc8"
+    Hint: Title
+    Value: OG Type
+  Versions:
+  - Version: 1
+    Fields:
+    - ID: "25bed78c-4957-4165-998a-ca1b52f67497"
+      Hint: __Created
+      Value: 20240328T170230Z
+    - ID: "52807595-0f8f-4b20-8d2a-cb71d28c6103"
+      Hint: __Owner
+      Value: |
+        sitecore\UOUBIWQRx7
+    - ID: "5dd74568-4d4b-44c1-b513-0af5f4cda34f"
+      Hint: __Created by
+      Value: |
+        sitecore\UOUBIWQRx7
+    - ID: "8cdc337e-a112-42fb-bbb4-4143751e123f"
+      Hint: __Revision
+      Value: "2e057ac1-1fbe-47cf-9fef-6d63c8dd04e8"
+    - ID: "badd9cf9-53e0-4d0c-bcc0-2d784c282f6a"
+      Hint: __Updated by
+      Value: |
+        sitecore\UOUBIWQRx7
+    - ID: "d9cf14b1-fa16-4ba6-9288-e8a174d4d522"
+      Hint: __Updated
+      Value: 20240328T172332Z
diff --git a/src/Project/Sugcon2024/items/Templates/Sugcon2024/Page Templates/_BasePage.yml b/src/Project/Sugcon2024/items/Templates/Sugcon2024/Page Templates/_BasePage.yml
@@ -1,41 +1,42 @@
----
-ID: "6a1b5fe6-5f3d-49fb-ac10-1f925c67e105"
-Parent: "146849cf-b4c7-4b24-b4f3-1d2483710f56"
-Template: "ab86861a-6030-46c5-b394-e8f99e8b87db"
-Path: /sitecore/templates/Project/Sugcon2024/Page Templates/_BasePage
-SharedFields:
-- ID: "12c33f3f-86c5-43a5-aeb4-5598cec45116"
-  Hint: __Base template
-  Value: |
-    {47151711-26CA-434E-8132-D3E0B7D26683}
-    {371D5FBB-5498-4D94-AB2B-E3B70EEBE78C}
-    {4414A1F9-826A-4647-8DF4-ED6A95E64C43}
-    {F39A594A-7BC9-4DB0-BAA1-88543409C1F9}
-    {6650FB34-7EA1-4245-A919-5CC0F002A6D7}
-    {69F3677A-105C-41D6-9D7C-0F85A172A827}
-Languages:
-- Language: en
-  Versions:
-  - Version: 1
-    Fields:
-    - ID: "25bed78c-4957-4165-998a-ca1b52f67497"
-      Hint: __Created
-      Value: 20240313T045728Z
-    - ID: "52807595-0f8f-4b20-8d2a-cb71d28c6103"
-      Hint: __Owner
-      Value: |
-        sitecore\x3rLvWVVyq
-    - ID: "5dd74568-4d4b-44c1-b513-0af5f4cda34f"
-      Hint: __Created by
-      Value: |
-        sitecore\x3rLvWVVyq
-    - ID: "8cdc337e-a112-42fb-bbb4-4143751e123f"
-      Hint: __Revision
-      Value: "4b1ac4e8-8d09-4c1b-a4cf-3f92538cc09a"
-    - ID: "badd9cf9-53e0-4d0c-bcc0-2d784c282f6a"
-      Hint: __Updated by
-      Value: |
-        sitecore\x3rLvWVVyq
-    - ID: "d9cf14b1-fa16-4ba6-9288-e8a174d4d522"
-      Hint: __Updated
-      Value: 20240313T050428Z
+---
+ID: "6a1b5fe6-5f3d-49fb-ac10-1f925c67e105"
+Parent: "146849cf-b4c7-4b24-b4f3-1d2483710f56"
+Template: "ab86861a-6030-46c5-b394-e8f99e8b87db"
+Path: /sitecore/templates/Project/Sugcon2024/Page Templates/_BasePage
+SharedFields:
+- ID: "12c33f3f-86c5-43a5-aeb4-5598cec45116"
+  Hint: __Base template
+  Value: |
+    {47151711-26CA-434E-8132-D3E0B7D26683}
+    {371D5FBB-5498-4D94-AB2B-E3B70EEBE78C}
+    {4414A1F9-826A-4647-8DF4-ED6A95E64C43}
+    {F39A594A-7BC9-4DB0-BAA1-88543409C1F9}
+    {6650FB34-7EA1-4245-A919-5CC0F002A6D7}
+    {69F3677A-105C-41D6-9D7C-0F85A172A827}
+    {CB7020B6-B576-4B0D-AEE2-B81E9B69507A}
+Languages:
+- Language: en
+  Versions:
+  - Version: 1
+    Fields:
+    - ID: "25bed78c-4957-4165-998a-ca1b52f67497"
+      Hint: __Created
+      Value: 20240313T045728Z
+    - ID: "52807595-0f8f-4b20-8d2a-cb71d28c6103"
+      Hint: __Owner
+      Value: |
+        sitecore\x3rLvWVVyq
+    - ID: "5dd74568-4d4b-44c1-b513-0af5f4cda34f"
+      Hint: __Created by
+      Value: |
+        sitecore\x3rLvWVVyq
+    - ID: "8cdc337e-a112-42fb-bbb4-4143751e123f"
+      Hint: __Revision
+      Value: "f5536e5a-6dbd-464c-a9f2-008fc615263b"
+    - ID: "badd9cf9-53e0-4d0c-bcc0-2d784c282f6a"
+      Hint: __Updated by
+      Value: |
+        sitecore\UOUBIWQRx7
+    - ID: "d9cf14b1-fa16-4ba6-9288-e8a174d4d522"
+      Hint: __Updated
+      Value: 20240328T170258Z