diff --git a/src/app/(routes)/(website)/layout.tsx b/src/app/(routes)/(website)/layout.tsx index a400698..71ab4b2 100644 --- a/src/app/(routes)/(website)/layout.tsx +++ b/src/app/(routes)/(website)/layout.tsx @@ -13,7 +13,8 @@ export const metadata: Metadata = { template: "%s | parsa aghayi", default: "parsa aghayi", }, - description: "parsa aghayi personal website", + description: "parsa aghayi's personal website", + images: ["/og-image?text=parsa aghayi's personal website"], }, }; diff --git a/src/app/(routes)/(website)/page.tsx b/src/app/(routes)/(website)/page.tsx index 965ab35..ecfc9f8 100644 --- a/src/app/(routes)/(website)/page.tsx +++ b/src/app/(routes)/(website)/page.tsx @@ -13,9 +13,9 @@ export const metadata: Metadata = { description: "Hi, I am parsa aghayi. Frontend & Backend Developer and here is my personal website to know me and contact me if you want! ;)", openGraph: { - title: "parsa aghayi's personal website openGraph title", + title: "parsa aghayi's personal website", description: - "Hi, I am parsa aghayi. Frontend & Backend Developer and here is my personal website to know me and contact me if you want! ;) openGraph description", + "Hi, I am parsa aghayi. Frontend & Backend Developer and here is my personal website to know me and contact me if you want! ;)", images: ["/images/profile.png"], }, }; diff --git a/src/app/(routes)/blog/categories/page.tsx b/src/app/(routes)/blog/categories/page.tsx index 4faff67..6aa550f 100644 --- a/src/app/(routes)/blog/categories/page.tsx +++ b/src/app/(routes)/blog/categories/page.tsx @@ -13,6 +13,12 @@ export const metadata: Metadata = { title: "All Categories List", description: "Browse through our collection of categories to find posts on your favorite topics. Whether you`re looking for insightful articles, how-tos, or the latest trends, our categories make it easy to discover content tailored to your interests.", + openGraph: { + title: "All Categories List", + description: + "Browse through our collection of categories to find posts on your favorite topics. Whether you`re looking for insightful articles, how-tos, or the latest trends, our categories make it easy to discover content tailored to your interests.", + images: ["/og-image?text=All Categories List"], + }, }; export default async function Categories({ searchParams }: categoryPropsType) { diff --git a/src/app/(routes)/blog/filtered-posts/[filter]/page.tsx b/src/app/(routes)/blog/filtered-posts/[filter]/page.tsx index 184096a..a1e2f76 100644 --- a/src/app/(routes)/blog/filtered-posts/[filter]/page.tsx +++ b/src/app/(routes)/blog/filtered-posts/[filter]/page.tsx @@ -15,6 +15,7 @@ export const metadata: Metadata = { openGraph: { title: "", description: "", + images: ["/og-image?text=filtered posts"], }, }; @@ -37,6 +38,9 @@ export default async function FilteredPosts({ ? (metadata.openGraph.description = "New Browse through our collection of categories to find posts on your favorite topics. Whether you`re looking for insightful articles, how-tos, or the latest trends, our categories make it easy to discover content tailored to your interests.") : ""; + metadata.openGraph + ? (metadata.openGraph.images = ["/og-image?text=All New Posts List"]) + : []; break; case "popular": filteredPostApiUrl = "/posts?sort_field=views&sort_direction=desc"; @@ -50,6 +54,11 @@ export default async function FilteredPosts({ ? (metadata.openGraph.description = "Popular Browse through our collection of categories to find posts on your favorite topics. Whether you`re looking for insightful articles, how-tos, or the latest trends, our categories make it easy to discover content tailored to your interests.") : ""; + metadata.openGraph + ? (metadata.openGraph.images = [ + "/og-image?text=All Popular Posts List", + ]) + : []; break; default: // code block diff --git a/src/app/(routes)/blog/layout.tsx b/src/app/(routes)/blog/layout.tsx index bf1221f..84c2b8d 100644 --- a/src/app/(routes)/blog/layout.tsx +++ b/src/app/(routes)/blog/layout.tsx @@ -14,7 +14,7 @@ export const metadata: Metadata = { default: "parsa aghayi's blog", }, description: "parsa aghayi personal blog", - images: ["/images/favicons/blog-icon.png"], + images: ["/og-image?text=parsa aghayi's personal blog"], }, }; diff --git a/src/app/(routes)/og-image/route.tsx b/src/app/(routes)/og-image/route.tsx new file mode 100644 index 0000000..9d28433 --- /dev/null +++ b/src/app/(routes)/og-image/route.tsx @@ -0,0 +1,33 @@ +import { ImageResponse } from "next/og"; + +export const runtime = "edge"; + +export async function GET(request: Request) { + const { searchParams } = new URL(request.url); + const text = searchParams.get("text") || "Hello world!"; + + return new ImageResponse( + ( +
+ {text} +
+ ), + { + width: 1200, + height: 1200, + }, + ); +}