feat(seo): add Learning Center, hreflang, OG tags, and high-value content pages (#2024)

Author: moonming

config/hreflang.js

@@ -0,0 +1,82 @@
+const SITE_URL = 'https://apisix.apache.org';
+
+/**
+ * Docusaurus plugin that injects hreflang <link> tags and canonical URLs
+ * into every HTML page during the post-build phase.
+ *
+ * For each page, it generates:
+ *   <link rel="alternate" hreflang="en"        href="https://apisix.apache.org/..." />
+ *   <link rel="alternate" hreflang="zh"        href="https://apisix.apache.org/zh/..." />
+ *   <link rel="alternate" hreflang="x-default" href="https://apisix.apache.org/..." />
+ *   <link rel="canonical" href="..." />  (if not already present)
+ */
+module.exports = function hreflangPlugin() {
+  return {
+    name: 'hreflang',
+
+    async postBuild({ outDir }) {
+      const fs = require('fs');
+      const path = require('path');
+
+      function findHtmlFiles(dir) {
+        const results = [];
+        const entries = fs.readdirSync(dir, { withFileTypes: true });
+        for (const entry of entries) {
+          const fullPath = path.join(dir, entry.name);
+          if (entry.isDirectory()) {
+            results.push(...findHtmlFiles(fullPath));
+          } else if (entry.name.endsWith('.html')) {
+            results.push(fullPath);
+          }
+        }
+        return results;
+      }
+
+      const htmlFiles = findHtmlFiles(outDir);
+
+      for (const filePath of htmlFiles) {
+        let html = fs.readFileSync(filePath, 'utf-8');
+
+        // Determine relative path from outDir
+        const relativePath = path.relative(outDir, filePath);
+
+        // Determine the current locale based on file path
+        const isZh = relativePath.startsWith('zh' + path.sep);
+
+        // Compute the path without locale prefix
+        const pathWithoutLocale = isZh
+          ? relativePath.slice(3) // remove "zh/"
+          : relativePath;
+
+        // Normalize path separators for URL
+        const urlPath = pathWithoutLocale.split(path.sep).join('/');
+
+        // Build URLs
+        const enUrl = `${SITE_URL}/${urlPath}`.replace(/\/index\.html$/, '/');
+        const zhUrl = `${SITE_URL}/zh/${urlPath}`.replace(/\/index\.html$/, '/');
+        const currentUrl = isZh ? zhUrl : enUrl;
+
+        // Build hreflang tags
+        const hreflangTags = [
+          `<link rel="alternate" hreflang="en" href="${enUrl}" />`,
+          `<link rel="alternate" hreflang="zh" href="${zhUrl}" />`,
+          `<link rel="alternate" hreflang="x-default" href="${enUrl}" />`,
+        ].join('\n    ');
+
+        // Add canonical tag if not already present
+        const hasCanonical = html.includes('rel="canonical"');
+        const canonicalTag = hasCanonical
+          ? ''
+          : `<link rel="canonical" href="${currentUrl}" />`;
+
+        // Inject before </head>
+        const injection = [hreflangTags, canonicalTag]
+          .filter(Boolean)
+          .join('\n    ');
+        html = html.replace('</head>', `    ${injection}\n  </head>`);
+
+        fs.writeFileSync(filePath, html, 'utf-8');
+      }
+    },
+  };
+};

config/navbar.js

@@ -52,6 +52,12 @@ module.exports = [
       },
     ],
   },
+  {
+    to: '/learning-center',
+    label: 'Learning Center',
+    position: 'right',
+    target: '_parent',
+  },
   {
     to: '/blog',
     label: 'Blog',

website/docusaurus.config.js

@@ -95,9 +95,21 @@ module.exports = {
         blogTitle: 'Article',
       },
     ],
+    [
+      '@docusaurus/plugin-content-blog',
+      {
+        id: 'learning-center',
+        routeBasePath: 'learning-center',
+        path: 'learning-center',
+        blogSidebarCount: 'ALL',
+        blogSidebarTitle: 'Learning Center',
+        blogTitle: 'Learning Center',
+        showReadingTime: true,
+      },
+    ],
     ['docusaurus-plugin-sass', {}],
     require.resolve('../config/schema-org'),
-    require.resolve('../config/breadcrumb'),
+    require.resolve('../config/hreflang'),
   ],
   themeConfig: {
     navbar: {
@@ -146,6 +158,22 @@ module.exports = {
         name: 'twitter:card',
         content: 'summary_large_image',
       },
+      {
+        name: 'twitter:site',
+        content: '@apacheapisix',
+      },
+      {
+        property: 'og:site_name',
+        content: 'Apache APISIX',
+      },
+      {
+        property: 'og:type',
+        content: 'website',
+      },
+      {
+        property: 'og:image',
+        content: 'https://static.apiseven.com/202202/apache-apisix.png',
+      },
     ],
   },
   scripts: [

website/i18n/zh/code.json

@@ -1,4 +1,8 @@
 {
+  "homepage.meta.title": {
+    "message": "Apache APISIX - 开源云原生 API 网关与 AI 网关",
+    "description": "Homepage title for Chinese locale"
+  },
   "common.punctuation.anEnd": {
     "message": "。",
     "description": "."