1 files changed, 42 insertions, 21 deletions
diff --git a/src/components/Branding/Branding.tsx b/src/components/Branding/Branding.tsx
index 9421314..5e2cf6a 100644
--- a/src/components/Branding/Branding.tsx
+++ b/src/components/Branding/Branding.tsx
@@ -6,36 +6,57 @@ import photo from '@assets/images/armand-philippot.jpg';
 import Logo from '@assets/images/armand-philippot-logo.svg';
 import { config } from '@config/website';
 import styles from './Branding.module.scss';
+import Head from 'next/head';
+import { Person, WithContext } from 'schema-dts';
 
 type BrandingReturn = ({ isHome }: { isHome: boolean }) => ReactElement;
 
 const Branding: BrandingReturn = ({ isHome = false }) => {
   const TitleTag = isHome ? 'h1' : 'p';
 
+  const schemaJsonLd: WithContext<Person> = {
+    '@context': 'https://schema.org',
+    '@type': 'Person',
+    '@id': `${config.url}/#branding`,
+    name: config.name,
+    url: config.url,
+    jobTitle: config.baseline,
+    image: photo.src,
+    subjectOf: { '@id': `${config.url}` },
+  };
+
   return (
-    <div className={styles.wrapper}>
-      <div className={styles.logo}>
-        <div className={styles.logo__front}>
-          <Image
-            src={photo}
-            alt={t({
-              message: `${config.name} picture`,
-              comment: 'Branding logo.',
-            })}
-            layout="responsive"
-          />
-        </div>
-        <div className={styles.logo__back}>
-          <Logo />
+    <>
+      <Head>
+        <script
+          type="application/ld+json"
+          dangerouslySetInnerHTML={{ __html: JSON.stringify(schemaJsonLd) }}
+        ></script>
+      </Head>
+      <div id="branding" className={styles.wrapper}>
+        <div className={styles.logo}>
+          <div className={styles.logo__front}>
+            <Image
+              src={photo}
+              alt={t({
+                message: `${config.name} picture`,
+                comment: 'Branding logo.',
+              })}
+              layout="responsive"
+            />
+          </div>
+          <div className={styles.logo__back}>
+            <Logo />
+          </div>
         </div>
+        <TitleTag className={styles.name}>
+          <Link href="/">
+            <a className={styles.link}>{config.name}</a>
+          </Link>
+        </TitleTag>
+        <p className={styles.job}>{config.baseline}</p>
       </div>
-      <TitleTag className={styles.name}>
-        <Link href="/">
-          <a className={styles.link}>{config.name}</a>
-        </Link>
-      </TitleTag>
-      <p className={styles.job}>{config.baseline}</p>
-    </div>
+    </>
   );
 };