SEO

datocms · Dec 17, 2024 · e2b58cb · e2b58cb
1 parent 9e8b4ae
commit e2b58cb
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 13 deletions.
diff --git a/src/pages/customer-stories/p/[pageIndex]/index.astro b/src/pages/customer-stories/p/[pageIndex]/index.astro
@@ -13,6 +13,7 @@ import { perPage, query } from './_graphql';
 import { render as toPlainText } from 'datocms-structured-text-to-plain-text';
 import s from './_style.module.css';
 import { DraftModeQueryListener } from '~/components/DraftModeQueryListener';
+import { overrideSeo, seoDescription, seoGeneratedCard, seoTitle } from '~/lib/datocms/seo';
 
 export interface Props {
   pageIndex?: number;
@@ -42,7 +43,19 @@ if (!page || posts.length === 0) {
 }
 ---
 
-<Layout additionalSeo={page.seo}>
+<Layout
+  additionalSeo={overrideSeo(
+    page.seo,
+    seoTitle('Customer stories'),
+    seoDescription(
+      'Conversations with customers working on some really cool use cases with DatoCMS',
+    ),
+    seoGeneratedCard(Astro, {
+      title: 'Customer stories',
+      excerpt: 'Conversations with customers working on some really cool use cases with DatoCMS',
+    }),
+  )}
+>
   <Hero>
     <Fragment slot="title"><mark>Customer Stories</mark></Fragment>
     <Fragment slot="subtitle">

diff --git a/src/pages/og-card/index.png.ts b/src/pages/og-card/index.png.ts
@@ -73,18 +73,20 @@ export const GET: APIRoute = async ({ request, url }) => {
             gap: '20px',
           })}"
         >
-          <div
-            style="${css({
-              fontSize: '30px',
-              color: '#71788a',
-              letterSpacing: '-0.04em',
-              textTransform: 'uppercase',
-              display: 'flex',
-              fontWeight: 'bold',
-            })}"
-          >
-            ${kicker}
-          </div>
+          ${kicker
+            ? /* HTML */ `<div
+                style="${css({
+                  fontSize: '30px',
+                  color: '#71788a',
+                  letterSpacing: '-0.04em',
+                  textTransform: 'uppercase',
+                  display: 'flex',
+                  fontWeight: 'bold',
+                })}"
+              >
+                ${kicker}
+              </div>`
+            : ''}
           ${logoPngUrl
             ? /* HTML */ `
               <img