fix

tubone24 · Mar 16, 2024 · 6d653c2 · 6d653c2
1 parent 2994e84
commit 6d653c2
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 7 deletions.
diff --git a/src/__generated__/gatsby-types.d.ts b/src/__generated__/gatsby-types.d.ts
diff --git a/src/components/SEO/index.tsx b/src/components/SEO/index.tsx
@@ -8,6 +8,7 @@ type Props = {
   siteTitleAlt: string;
   isPost: boolean;
   image: string;
+  ogpImage?: string;
   tag: string;
   description: string;
 };
@@ -94,13 +95,11 @@ const SEO = ({
   title = config.siteTitle,
   description,
   image,
+  ogpImage,
   siteTitleAlt,
   isPost,
   tag,
 }: Props) => {
-  const ogpImageLink = `https://blog.tubone-project24.xyz/ogp.png?title=${encodeURI(
-    title
-  )}`;
   return (
     <Helmet>
       <title>{title}</title>
@@ -142,7 +141,7 @@ const SEO = ({
       <meta name="twitter:creator" content="@meitante1conan" />
       <meta name="twitter:title" content={title} />
       <meta name="twitter:description" content={description} />
-      <meta name="twitter:image" content={ogpImageLink} />
+      <meta name="twitter:image" content={ogpImage || image} />
     </Helmet>
   );
 };

diff --git a/src/content/2024-02-28-妻のためにFRUITS-ZIPPERの情報更新をSlackするようにしました.md b/src/content/2024-02-28-妻のためにFRUITS-ZIPPERの情報更新をSlackするようにしました.md
@@ -9,6 +9,7 @@ tags:
   - Deno DOM
   - ptera
 headerImage: https://i.imgur.com/FO7l5lW.png
+ogpImage: https://i.imgur.com/R4WlvEE.png
 templateKey: blog-post
 ---
 
@@ -225,4 +226,3 @@ Viewを変更することでカレンダー表示にもできます。（使い
 妻からもよいフィードバックが!!!やったやったー!!!
 
 ![img](https://i.imgur.com/vzyD8Iu.png)
-
diff --git a/src/templates/blog-post.tsx b/src/templates/blog-post.tsx
@@ -85,6 +85,12 @@ class BlogPost extends Component<Props> {
           tag={frontmatter?.tags ? frontmatter.tags[0] || "" : ""}
           description={excerpt || ""}
           image={frontmatter?.headerImage || config.defaultImage || ""}
+          ogpImage={
+            frontmatter?.ogpImage ||
+            frontmatter?.headerImage ||
+            config.defaultImage ||
+            ""
+          }
         />
       </div>
     );
@@ -102,6 +108,7 @@ export const pageQuery = graphql`
       slug
       date
       headerImage
+      ogpImage
       tags
     }
   }