diff --git a/src/app/(main)/(marketing)/blog/[slug]/page.tsx b/src/app/(main)/(marketing)/blog/[slug]/page.tsx index 1a7f0e2..ed2e65d 100644 --- a/src/app/(main)/(marketing)/blog/[slug]/page.tsx +++ b/src/app/(main)/(marketing)/blog/[slug]/page.tsx @@ -4,18 +4,41 @@ import { getPublishedPostBySlug, getAuthorBySlug, getRelatedPosts, getPublishedP import { AnswerBox } from "@/components/aeo/AnswerBox"; import { StepList } from "@/components/aeo/StepList"; import { FAQSection } from "@/components/aeo/FAQSection"; +import { SourcesList } from "@/components/aeo/SourcesList"; import { AuthorCard } from "@/components/author/AuthorCard"; import { RelatedPosts } from "@/components/blog/RelatedPosts"; -import { blogPostingSchema, howToSchema, faqPageSchema } from "@/lib/schema"; +import { blogPostingSchema, howToSchema, faqPageSchema, breadcrumbSchema } from "@/lib/schema"; import Image from "next/image"; import Link from "next/link"; export function generateMetadata({ params }: { params: { slug: string } }) { const post = getPublishedPostBySlug(params.slug); if (!post) return {}; + + const ogImage = post.heroImage ? `https://www.qrmaster.net${post.heroImage}` : undefined; + return { title: post.title, description: post.description, + alternates: { + canonical: `https://www.qrmaster.net/blog/${post.slug}`, + }, + openGraph: { + title: post.title, + description: post.description, + type: 'article', + publishedTime: post.datePublished, + modifiedTime: post.dateModified || post.datePublished, + authors: ['https://www.qrmaster.net'], + tags: post.keywords, + images: ogImage ? [{ url: ogImage, alt: post.imageAlt || post.title }] : undefined, + }, + twitter: { + card: 'summary_large_image', + title: post.title, + description: post.description, + images: ogImage ? [ogImage] : undefined, + } }; } @@ -38,6 +61,15 @@ export default function BlogPostPage({ params }: { params: { slug: string } }) { const howtoLd = post.keySteps?.length ? howToSchema(post, author) : null; const faqLd = post.faq ? faqPageSchema(post.faq) : null; + // Generate breadcrumb schema: Home → Learn → Pillar → Post + const pillarName = post.pillar ? post.pillar.charAt(0).toUpperCase() + post.pillar.slice(1) : 'Blog'; + const breadcrumbLd = breadcrumbSchema([ + { name: 'Home', url: '/' }, + { name: 'Learn', url: '/learn' }, + { name: pillarName, url: `/learn/${post.pillar}` }, + { name: post.title, url: `/blog/${post.slug}` }, + ]); + return (