公开页补齐自引用 Canonical 与按类型的结构化数据，图片补上说明文字。

后台设置和内容编辑改成可导航布局；部署用访客 origin 生成 Canonical，避免落到容器地址。

Co-authored-by: Cursor <cursoragent@cursor.com>

frontend/app/announcement/[id]/page.tsx

@@ -17,6 +17,9 @@ import {
   SiteDocMasthead,
   SiteDocBreadcrumb,
 } from "@/components/site-doc";
+import { requestCanonical } from "@/lib/canonicalMeta";
+import { webPageJsonLd } from "@/lib/jsonLd";
+import JsonLd from "@/components/JsonLd";
 
 interface PageProps {
   params: Promise<{ id: string }>;
@@ -35,6 +38,7 @@ export async function generateMetadata({ params }: PageProps): Promise<Metadata>
       type: "article",
       publishedTime: data.announcement.created_at,
     },
+    ...(await requestCanonical(`/announcement/${data.announcement.id}`)),
   };
 }
 
@@ -71,15 +75,15 @@ export default async function AnnouncementPage({ params }: PageProps) {
       );
     };
 
-  const jsonLd = {
-    "@context": "https://schema.org",
-    "@type": "Article",
-    headline: a.title,
+  const jsonLd = webPageJsonLd({
+    type: "Article",
+    name: a.title,
+    path: `/announcement/${a.id}`,
     datePublished: a.created_at,
     dateModified: a.updated_at,
     articleSection: "站点公告",
     keywords: a.tag,
-  };
+  });
 
   const left = (
     <>
@@ -97,10 +101,7 @@ export default async function AnnouncementPage({ params }: PageProps) {
 
   return (
     <>
-      <script
-        type="application/ld+json"
-        dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}
-      />
+      <JsonLd data={jsonLd} />
 
       <SiteDocShell
         left={left}