[docs] Fix SEO site name description

mui · Mar 1, 2025 · b64194d · b64194d
1 parent 46ecc88
commit b64194d
Showing 1 changed file with 32 additions and 16 deletions.
diff --git a/docs/src/app/(public)/page.tsx b/docs/src/app/(public)/page.tsx
@@ -7,23 +7,39 @@ import './page.css';
 
 export default function Homepage() {
   return (
-    <div className="HomepageRoot">
-      <div className="HomepageContent">
-        <Logo className="mb-8 ml-px" aria-label="Base UI" />
-        <h1 className="HomepageHeading">
-          Unstyled UI components for building accessible web apps and design systems.
-        </h1>
-        <p className="HomepageCaption">
-          From the creators of Radix, Floating&nbsp;UI, and Material&nbsp;UI.
-        </p>
-        <Link
-          className="-m-1 inline-flex items-center gap-1 p-1"
-          href="/react/overview/quick-start"
-        >
-          Documentation <ArrowRightIcon />
-        </Link>
+    <React.Fragment>
+      {/* Set the Site name for Google results. https://developers.google.com/search/docs/appearance/site-names */}
+      <script
+        type="application/ld+json"
+        // eslint-disable-next-line react/no-danger
+        dangerouslySetInnerHTML={{
+          __html: JSON.stringify({
+            '@context': 'https://schema.org',
+            '@type': 'WebSite',
+            name: 'Base UI',
+            url: 'https://base-ui.com',
+          }),
+        }}
+      />
+      <div className="HomepageRoot">
+        <div className="HomepageContent">
+          <Logo className="mb-8 ml-px" aria-label="Base UI" />
+          <h1 className="HomepageHeading">
+            Unstyled UI components for building accessible web apps and design
+            systems.
+          </h1>
+          <p className="HomepageCaption">
+            From the creators of Radix, Floating&nbsp;UI, and Material&nbsp;UI.
+          </p>
+          <Link
+            className="-m-1 inline-flex items-center gap-1 p-1"
+            href="/react/overview/quick-start"
+          >
+            Documentation <ArrowRightIcon />
+          </Link>
+        </div>
       </div>
-    </div>
+    </React.Fragment>
   );
 }