seo: add og:type

aster-void · aster-void · commit 349babfa2ad3 · 2025-05-16T12:41:27.000+09:00
diff --git a/src/layouts/GlobalLayout.astro b/src/layouts/GlobalLayout.astro
@@ -4,6 +4,7 @@ import "+/global.css";
 import { ClientRouter } from "astro:transitions";
 import Footer from "+/components/Footer.astro";
 import Header from "+/components/Header.astro";
+import type { OgType } from "+/lib/types";
 import type { Focus } from "+/schema";
 import Meta from "./meta.astro";
 
@@ -13,13 +14,19 @@ interface Props {
   focus: Focus;
   class?: string;
   image: ImageMetadata | null;
+  type?: OgType;
 }
-const { title, description, focus, image } = Astro.props;
+const { title, description, focus, image, type } = Astro.props;
 ---
 
-<html lang="ja" class="bg-gray-50 text-gray-800" data-theme="light">
+<html
+  lang="ja"
+  prefix="og: http://ogp.me/ns#"
+  class="bg-gray-50 text-gray-800"
+  data-theme="light"
+>
   <head>
-    <Meta {title} {description} image={image} />
+    <Meta {title} {description} image={image} og_type={type} />
   </head>
   <body class="min-h-[100vh]">
     <ClientRouter />
diff --git a/src/layouts/meta.astro b/src/layouts/meta.astro
@@ -1,13 +1,15 @@
 ---
-import { addOrigin } from "+/lib/utils";
+import type { OgType } from "+/lib/types.ts";
+import { addOrigin } from "+/lib/utils.ts";
 
 interface Props {
   title: string | null;
   description: string | null;
   keywords?: string[];
   image: ImageMetadata | null;
+  og_type?: OgType | undefined;
 }
-const { title, description, keywords = [], image } = Astro.props;
+const { title, description, keywords = [], image, og_type } = Astro.props;
 const url = Astro.url.href;
 ---
 
@@ -21,6 +23,7 @@ const url = Astro.url.href;
   name="description"
   content={description ?? "東京大学のソフトウェアエンジニアリングコミュニティ"}
 />
+<meta property="og:type" content={og_type ?? "website"} />
 <meta property="og:site_name" content="ut.code();" />
 <meta property="og:title" content={title} />
 {description && <meta property="og:description" content={description} />}
diff --git a/src/lib/types.ts b/src/lib/types.ts
@@ -0,0 +1 @@
+export type OgType = "website" | "profile" | "article";
diff --git a/src/pages/articles/[...id].astro b/src/pages/articles/[...id].astro
@@ -25,6 +25,7 @@ const author = article.data.author && (await getMember(article.data.author.id));
   description={null}
   focus={Focus.articles}
   image={article.data.image}
+  type="article"
 >
   <div class="mt-2 text-center lg:px-8">
     <Picture
diff --git a/src/pages/members/[member].astro b/src/pages/members/[member].astro
@@ -29,6 +29,7 @@ const articles = await getArticles({
   description={`ut.code(); のメンバーの${member.data.nameJa}です。`}
   focus={Focus.members}
   image={member.data.upperBodyImage}
+  type="profile"
 >
   <main class="w-full">
     <div

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1 @@`
	`1`	`+export type OgType = "website" \| "profile" \| "article";`
Original file line number	Diff line number	Diff line change
`@@ -25,6 +25,7 @@ const author = article.data.author && (await getMember(article.data.author.id));`
`25`	`25`	`description={null}`
`26`	`26`	`focus={Focus.articles}`
`27`	`27`	`image={article.data.image}`
	`28`	`+ type="article"`
`28`	`29`	`>`
`29`	`30`	`<div class="mt-2 text-center lg:px-8">`
`30`	`31`	`<Picture`
Original file line number	Diff line number	Diff line change
`@@ -29,6 +29,7 @@ const articles = await getArticles({`
`29`	`29`	description={`ut.code(); のメンバーの${member.data.nameJa}です。`}
`30`	`30`	`focus={Focus.members}`
`31`	`31`	`image={member.data.upperBodyImage}`
	`32`	`+ type="profile"`
`32`	`33`	`>`
`33`	`34`	`<main class="w-full">`
`34`	`35`	`<div`