Add Schema.org JSON-LD structured data for SEO

Implemented comprehensive Schema.org structured data across the blog to improve SEO and enable rich snippets in search results. Changes: - Created JSON-LD helper component for safe schema rendering - Added BlogPosting schema to blog posts with: * Article metadata (headline, description, image, dates) * Author and publisher information * Keywords and article sections from tags - Added BreadcrumbList schema to blog posts for navigation - Added WebSite and Organization schemas to root layout * Site-wide identity and branding * Search action for site search functionality - Added CollectionPage schema to homepage * Blog collection metadata - Added WebPage schema to static pages * Page metadata with dates and images Benefits: - Rich snippets in Google/Bing search results - Better content understanding by search engines - Article cards with images, dates, authors in SERPs - Breadcrumb navigation in search results - Improved SEO ranking signals All schemas validated against Schema.org specifications and include proper Chinese language support. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-20 21:23:10 +08:00
parent 237e5d403b
commit 6badd76733
5 changed files with 190 additions and 1 deletions
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -4,6 +4,7 @@ import { siteConfig } from '@/lib/config';
 import { LayoutShell } from '@/components/layout-shell';
 import { ThemeProvider } from 'next-themes';
 import { Playfair_Display } from 'next/font/google';
+import { JsonLd } from '@/components/json-ld';

 const playfair = Playfair_Display({
  subsets: ['latin'],
@@ -49,9 +50,48 @@ export default function RootLayout({
 }) {
  const theme = siteConfig.theme;

+  // WebSite Schema
+  const websiteSchema = {
+    '@context': 'https://schema.org',
+    '@type': 'WebSite',
+    name: siteConfig.title,
+    description: siteConfig.description,
+    url: siteConfig.url,
+    inLanguage: siteConfig.defaultLocale,
+    author: {
+      '@type': 'Person',
+      name: siteConfig.author,
+      url: siteConfig.url,
+    },
+    potentialAction: {
+      '@type': 'SearchAction',
+      target: {
+        '@type': 'EntryPoint',
+        urlTemplate: `${siteConfig.url}/blog?search={search_term_string}`,
+      },
+      'query-input': 'required name=search_term_string',
+    },
+  };
+
+  // Organization Schema
+  const organizationSchema = {
+    '@context': 'https://schema.org',
+    '@type': 'Organization',
+    name: siteConfig.name,
+    url: siteConfig.url,
+    logo: `${siteConfig.url}${siteConfig.avatar}`,
+    sameAs: [
+      siteConfig.social.github,
+      siteConfig.social.twitter && `https://twitter.com/${siteConfig.social.twitter.replace('@', '')}`,
+      siteConfig.social.mastodon,
+    ].filter(Boolean),
+  };
+
  return (
    <html lang={siteConfig.defaultLocale} suppressHydrationWarning className={playfair.variable}>
      <body>
+        <JsonLd data={websiteSchema} />
+        <JsonLd data={organizationSchema} />
        <style
          // Set CSS variables for accent colors (light + dark variants)
          dangerouslySetInnerHTML={{