行业资讯栏目 SEO 评估报告

1. 背景

官网新增「行业资讯」路由页面（/article/），由销售部门编写文章内容，在前端渲染展示。需要评估当前技术栈是否支持文章内容被搜索引擎抓取和索引，确保文章详情页具备完善的 SEO 能力。

2. 当前技术架构分析

2.1 技术栈

项目	技术	版本
静态站点生成器	VitePress	^1.4.3
前端框架	Vue 3	^3.5.12
数据源	低代码平台 DB API	自研
部署方式	静态文件 + Nginx	-

2.2 VitePress 渲染机制

VitePress 采用 SSG（Static Site Generation） 模式，构建时将 .md 文件预渲染为静态 HTML。搜索引擎爬虫可以直接读取到 HTML 内容，对 Markdown 编写的静态内容天然具备良好的 SEO 支持。

2.3 当前文章页实现方式

src/article/index.md          → 文章列表页（frontmatter + <custom-article-page /> 组件）
.vitepress/components/CustomArticlePage.vue  → 列表组件（硬编码 9 篇文章数据）

关键问题：

文章数据是硬编码在 Vue 组件中的 ref([...])，并非来自 Markdown 文件或后端 API
不存在文章详情页，点击文章卡片无法跳转
导航栏中「行业资讯」入口目前被注释掉

3. SEO 支持评估

3.1 文章列表页（/article/）— 基本支持

检查项	状态	说明
页面 TDK	✅	frontmatter 已配置 title、description、keywords
语义化 HTML	✅	使用了 `<h1>`、`<h2>`、`<article>`、`<p>` 等标签
SSG 预渲染	⚠️	组件中的数据在构建时会被渲染到 HTML，但分类筛选是客户端交互，爬虫只能抓到"全部"分类下的完整列表
sitemap	✅	VitePress 自动生成 sitemap.xml，包含 `/article/`

3.2 文章详情页 — 不支持

检查项	状态	说明
独立 URL	❌	不存在文章详情页，所有文章仅在列表页展示摘要
文章全文内容	❌	爬虫无法抓取文章完整内容，只能获取列表摘要
单篇文章 TDK	❌	无法为每篇文章设置独立的 title / description / keywords
结构化数据	❌	无 JSON-LD / Schema.org 标记（如 `Article`、`BlogPosting`）
OG / Twitter 标签	❌	无社交分享元数据
独立 URL 可分享	❌	无法分享或链接到某一篇具体文章

3.3 数据来源方式的 SEO 影响

当前项目存在两种数据来源模式：

数据来源	示例	SEO 友好度
Markdown 文件（静态）	各页面的 `.md` 文件	⭐⭐⭐⭐⭐ 构建时生成完整 HTML
Vue 组件硬编码数据	`CustomArticlePage.vue` 中的 `articles ref`	⭐⭐⭐⭐ 构建时也会渲染到 HTML
运行时 API 请求	`CustomMarketDetail.vue` 通过 `db.js` 请求	⭐ 爬虫无法获取动态加载内容

核心结论：如果文章由销售部门通过后台系统编写，数据通过 API 动态加载，则爬虫无法抓取文章内容。

4. 方案对比

方案 A：Markdown 文件方案

原理：销售部门编写的文章以 Markdown 文件形式存入仓库，VitePress 构建时预渲染为静态 HTML。

优势：

SEO 最优，构建时生成完整静态 HTML
每篇文章有独立 URL，可被搜索引擎单独索引
零额外依赖，VitePress 原生支持

劣势：

销售部门需要学习 Markdown 语法
每次发布文章需要提交代码并触发构建部署
不适合高频更新场景

适用场景：文章更新频率低（每周 1-3 篇），团队可接受 Git 工作流。

方案 B：CMS + 构建时数据拉取方案

原理：销售部门通过 CMS 编写文章，VitePress 在构建时通过 API 拉取文章数据，生成静态页面。

优势：

销售部门可通过后台系统编写，无需接触代码
构建时生成静态 HTML，SEO 友好

劣势：

需要开发构建时数据加载器
文章发布后需要触发重新构建
构建时间随文章数量增长

适用场景：文章通过后台系统管理，需要非技术人员可操作。

方案 C：SSR 服务端渲染方案（不推荐）

原理：将 VitePress 替换为支持 SSR 的框架（如 Nuxt.js），或在 VitePress 之外额外部署 SSR 服务。

不推荐原因：改造成本过高，与现有纯静态部署架构冲突大。

方案 D：预渲染 + 客户端水合方案

原理：构建时为每篇文章生成静态 HTML 骨架，运行时再通过 API 加载完整内容。

劣势：

爬虫只能获取骨架内容，无法获取文章全文
SEO 效果不如方案 A/B/E

方案 E：WordPress 文章系统 + VitePress 跳转（推荐）

原理：部署独立的 WordPress 站点作为文章系统，使用自定义 WordPress 主题使其视觉风格与 VitePress 官网保持一致。VitePress 官网的「行业资讯」列表页展示文章摘要，点击后跳转到 WordPress 的文章详情页。

5. 推荐方案

首选：方案 E（WordPress 文章系统 + VitePress 跳转）

理由：

SEO 能力最强：WordPress 是全球使用最广泛的 CMS，SEO 插件生态极其成熟，Yoast SEO / Rank Math 一键完成 TDK、OG 标签、结构化数据、Sitemap 等全部 SEO 需求
销售部门零门槛：所见即所得编辑器，无需学习 Markdown、Git 等技术工具，发布文章只需登录后台
发布即上线：文章发布后立即生效，无需触发构建流程，适合高频更新
与官网解耦：WordPress 独立部署运维，不影响 VitePress 官网的稳定性
长期可扩展：后续可轻松扩展评论、搜索、推荐、多语言等高级功能

备选：方案 A（Markdown 文件方案）

如果不想引入额外系统，方案 A 是最轻量的选择：

零额外依赖，VitePress 原生支持
但需要技术人员协助销售部门将文章转为 Markdown 文件

6. 方案综合对比

维度	方案 A (Markdown)	方案 B (CMS+构建拉取)	方案 C (SSR)	方案 E (WordPress)
SEO 效果	⭐⭐⭐⭐⭐	⭐⭐⭐⭐	⭐⭐⭐⭐	⭐⭐⭐⭐⭐
销售发文门槛	⭐⭐ 需技术协助	⭐⭐⭐ 需后台	⭐⭐⭐⭐	⭐⭐⭐⭐⭐ 零门槛
发布实时性	⭐⭐ 需构建部署	⭐⭐⭐ 需触发构建	⭐⭐⭐⭐⭐	⭐⭐⭐⭐⭐ 即时生效
实现成本	⭐⭐⭐⭐⭐ 最低	⭐⭐⭐	⭐ 需重构	⭐⭐⭐ 5-7天
运维成本	⭐⭐⭐⭐⭐ 零额外	⭐⭐⭐⭐	⭐⭐	⭐⭐⭐ 需维护 WP
内容管理能力	⭐⭐ 无后台	⭐⭐⭐	⭐⭐⭐⭐	⭐⭐⭐⭐⭐ 最丰富
用户体验一致性	⭐⭐⭐⭐⭐ 同站	⭐⭐⭐⭐⭐ 同站	⭐⭐⭐⭐⭐ 同站	⭐⭐⭐⭐ 需主题适配

7. 方案 E 实施要点（WordPress + VitePress 交互）

7.1 整体架构

用户访问流程：

www.suconnect.com                    www.suconnect.com/blog/
┌─────────────────────┐              ┌─────────────────────┐
│  VitePress 官网      │              │  WordPress 文章系统   │
│                     │   跳转链接    │                     │
│  /article/          │  ────────►   │  /blog/xxx/         │
│  （文章列表页）       │              │  （文章详情页）       │
│                     │              │                     │
│  静态 HTML          │              │  PHP SSR 渲染        │
│  Nginx 托管         │              │  Nginx + PHP-FPM    │
└─────────────────────┘              └─────────────────────┘

7.2 部署模式选择

推荐：子目录部署 — www.suconnect.com/blog/

对比项	子域名 (`blog.suconnect.com`)	子目录 (`www.suconnect.com/blog/`)
SEO 权重	独立积累，需额外建设	共享主域名权重 ✅
搜索引擎信任度	视为新站点，需重新建立	继承主站信任度 ✅
内链价值传递	跨域，权重传递打折	同域，完整传递 ✅
用户体验	URL 跳转到新域名，割裂感	URL 保持同域 ✅
部署复杂度	简单，各自独立 ✅	需 Nginx 反向代理配置
维护独立性	完全独立 ✅	共享 Nginx，需注意路由冲突

选择子目录的核心原因：SEO 权重共享。百度和 Google 都将子目录内容视为主站的一部分，而子域名通常被当作独立站点。对于新建的文章系统，借助 www.suconnect.com 已有的域名权重可以更快获得搜索引擎收录。

7.3 Nginx 路由配置

nginx

server {
    listen 443 ssl;
    server_name www.suconnect.com;

    # SSL 证书配置
    ssl_certificate     /etc/nginx/ssl/suconnect.com.pem;
    ssl_certificate_key /etc/nginx/ssl/suconnect.com.key;

    # ========== VitePress 静态站点 ==========
    location / {
        root /var/www/suconnect/dist;
        try_files $uri $uri/ $uri.html /index.html;

        # 静态资源缓存
        location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg|woff2?)$ {
            expires 30d;
            add_header Cache-Control "public, immutable";
        }
    }

    # ========== WordPress 文章系统 ==========
    location /blog/ {
        proxy_pass http://127.0.0.1:8080/;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;

        # 让 WordPress 知道它运行在 /blog/ 子目录下
        proxy_set_header X-Forwarded-Path /blog;

        # WordPress 静态资源缓存
        location ~* /blog/wp-content/.*\.(js|css|png|jpg|jpeg|gif|ico|svg|woff2?)$ {
            proxy_pass http://127.0.0.1:8080;
            expires 30d;
            add_header Cache-Control "public, immutable";
        }
    }

    # ========== 低代码平台 API 代理（已有）==========
    location /api/su-code-service {
        proxy_pass http://sudev.suconnect.com;
        proxy_set_header Host sudev.suconnect.com;
        proxy_set_header X-Real-IP $remote_addr;
    }
}

关键配置说明：

配置项	作用
`proxy_pass http://127.0.0.1:8080/`	末尾 `/` 会去掉 `/blog/` 前缀，WordPress 接收到的是 `/xxx/`
`X-Forwarded-Path /blog`	告诉 WordPress 实际运行在子目录，用于生成正确的 URL
`try_files $uri $uri/ $uri.html`	VitePress 静态页面的路由回退（兼容 `.html` 后缀）

7.4 WordPress 子目录配置

WordPress wp-config.php 中需配置：

php

/* 子目录部署关键配置 */
define('WP_HOME', 'https://www.suconnect.com/blog');
define('WP_SITEURL', 'https://www.suconnect.com/blog');

/* 确保 WordPress 生成正确的 URL */
$_SERVER['REQUEST_URI'] = '/blog' . $_SERVER['REQUEST_URI'];

/* 可选：强制 HTTPS */
define('FORCE_SSL_ADMIN', true);
if (isset($_SERVER['HTTP_X_FORWARDED_PROTO']) && $_SERVER['HTTP_X_FORWARDED_PROTO'] === 'https') {
    $_SERVER['HTTPS'] = 'on';
}

WordPress .htaccess（如果使用 Apache 作为 PHP 处理器）：

apache

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /blog/
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /blog/index.php [L]
</IfModule>
# END WordPress

7.5 VitePress ↔ WordPress 数据交互

WordPress 与 VitePress 之间有两种交互模式，推荐组合使用：

交互一：VitePress 列表页链接到 WordPress 详情页（即时生效）

最基础的交互：文章卡片添加超链接，点击跳转到 WordPress 详情页。

CustomArticlePage.vue 改造：

vue

<template>
  <!-- 文章卡片增加跳转链接 -->
  <article v-for="item in filteredArticles" :key="item.id" class="article-card">
    <a :href="item.url" class="card-link">
      <div class="card-meta">
        <span class="date">{{ item.date }}</span>
        <span v-for="tag in item.tags" :key="tag" class="tag">{{ tag }}</span>
      </div>
      <h3 class="card-title">{{ item.title }}</h3>
      <p class="card-summary">{{ item.summary }}</p>
    </a>
  </article>
</template>

文章数据增加 URL 字段：

javascript

const articles = ref([
  {
    id: 1,
    title: '低代码开发平台如何助力企业降本增效',
    summary: '...',
    url: '/blog/low-code-cost-reduction/',  // 指向 WordPress 详情页
    date: '2025-12-20',
    category: 'lowcode',
    tags: ['低代码', '企业数字化'],
  },
  // ...
])

交互二：构建时从 WordPress REST API 自动同步文章列表（推荐）

避免在 VitePress 和 WordPress 中手动维护两份文章数据，利用 VitePress 的 Build-Time Data Loading 在构建时自动从 WordPress 拉取文章列表。

/.vitepress/data/wp-articles.data.js：

javascript

// 构建时执行 — 从 WordPress REST API 拉取文章数据
const WP_API_BASE = 'https://www.suconnect.com/blog/wp-json/wp/v2'

export default {
  async load() {
    // 拉取已发布的文章，嵌入分类和标签信息
    const res = await fetch(
      `${WP_API_BASE}/posts?per_page=100&_embed=wp:term,wp:featuredmedia&status=publish`
    )
    const posts = await res.json()

    return posts.map(post => ({
      id: post.id,
      title: post.title.rendered,
      summary: post.excerpt.rendered.replace(/<[^>]+>/g, '').trim(),
      url: new URL(post.link).pathname,  // → /blog/low-code-cost-reduction/
      date: post.date.split('T')[0],     // → 2025-12-20
      category: post._embedded?.['wp:term']?.[0]?.[0]?.slug || 'uncategorized',
      tags: post._embedded?.['wp:term']?.[1]?.map(t => t.name) || [],
      cover: post._embedded?.['wp:featuredmedia']?.[0]?.source_url || '',
    }))
  }
}

CustomArticlePage.vue 中使用 data loader：

vue

<script setup>
import { ref, computed } from 'vue'
import { data as wpArticles } from '../../.vitepress/data/wp-articles.data.js'

// 替换硬编码数据，使用从 WordPress 拉取的文章列表
const articles = ref(wpArticles)

const activeCategory = ref('all')
const filteredArticles = computed(() => {
  if (activeCategory.value === 'all') return articles.value
  return articles.value.filter(a => a.category === activeCategory.value)
})
</script>

WordPress REST API 端点说明：

端点	作用
`GET /wp-json/wp/v2/posts`	获取文章列表
`GET /wp-json/wp/v2/posts/{id}`	获取单篇文章
`GET /wp-json/wp/v2/categories`	获取分类列表
`GET /wp-json/wp/v2/tags`	获取标签列表
`?_embed=wp:term,wp:featuredmedia`	嵌入关联的分类/标签/封面图数据
`?per_page=100&page=1`	分页参数
`?categories=5`	按分类筛选

WordPress REST API 是内置功能，无需安装额外插件，默认在 /wp-json/wp/v2/ 路径下暴露。

交互三：文章发布后自动触发 VitePress 重新构建

WordPress 文章发布/更新时，通过 Webhook 触发 VitePress 重新构建，确保列表页数据实时同步。

WordPress functions.php 添加 Webhook：

php

// 文章发布或更新时触发 VitePress 重新构建
function trigger_vitepress_rebuild($post_id, $post) {
    if ($post->post_type !== 'post' || $post->post_status !== 'publish') {
        return;
    }

    // 触发 CI/CD 构建（以 GitLab CI 为例）
    wp_remote_post('https://gitlab.com/api/v4/projects/YOUR_PROJECT_ID/trigger/pipeline', [
        'body' => [
            'token'  => 'YOUR_TRIGGER_TOKEN',
            'ref'    => 'master',
        ],
        'timeout' => 5,
        'blocking' => false,  // 异步，不阻塞 WordPress
    ]);
}
add_action('publish_post', 'trigger_vitepress_rebuild', 10, 2);

构建触发流程：

销售在 WordPress 发布文章
    ↓
WordPress publish_post 钩子触发
    ↓
Webhook 调用 CI/CD API（GitLab/GitHub Actions）
    ↓
CI/CD 拉取代码 → npm run build（VitePress 构建）
    ↓
VitePress 构建时 wp-articles.data.js 拉取最新文章列表
    ↓
生成新的静态文件 → 部署到 Nginx
    ↓
VitePress 列表页自动包含新文章

7.6 WordPress 自定义主题与官网风格统一

开发自定义 WordPress 主题，复刻 VitePress 官网的视觉风格：

主题文件结构：

suconnect-theme/
├── style.css              # 主题声明 + 全局样式（复用官网配色/字体）
├── header.php             # 顶部导航（复刻官网导航栏）
├── footer.php             # 底部页脚（复刻官网 Footer + 备案信息）
├── index.php              # 文章列表页（WordPress 端也有列表功能）
├── single.php             # 文章详情页模板
├── page.php               # 独立页面模板
├── functions.php           # 主题功能（Webhook、面包屑、SEO 辅助等）
├── assets/
│   ├── css/main.css       # 与官网统一的样式
│   └── js/main.js
└── screenshot.png

视觉统一要点：

统一项	说明
顶部导航	复刻 VitePress 官网导航栏样式，保留相同菜单项和链接，点击 logo 返回官网首页
底部页脚	复刻官网 Footer，包含备案信息、企业微信二维码等
配色方案	主色 `#0256ff`，背景色 `#f7f8fa`，文字色 `#1a1a1a`
字体	与官网一致的字体栈
面包屑导航	首页 > 行业资讯 > 文章标题（面包屑中「首页」链回 VitePress、「行业资讯」链回 `/article/`）
CTA 区域	文章底部添加「免费咨询」引导区域，链接回官网触发预约弹窗
侧边栏	可选：相关文章推荐、分类导航、标签云
响应式	与官网保持一致的断点和布局策略

面包屑导航 header.php 示例：

php

<nav class="breadcrumb" aria-label="面包屑导航">
  <a href="https://www.suconnect.com/">首页</a>
  <span class="separator">></span>
  <a href="https://www.suconnect.com/article/">行业资讯</a>
  <?php if (is_single()): ?>
    <span class="separator">></span>
    <span class="current"><?php the_title(); ?></span>
  <?php endif; ?>
</nav>

文章底部 CTA 区域 single.php 示例：

php

<div class="article-cta">
  <h3>想了解更多？免费获取解决方案</h3>
  <p>我们的专家团队将为您量身定制数字化转型方案</p>
  <a href="https://www.suconnect.com/#schedule" class="cta-button">免费咨询</a>
</div>

7.7 WordPress SEO 插件生态

功能	推荐插件	说明
SEO 全家桶	Yoast SEO / Rank Math	TDK、OG 标签、结构化数据、XML Sitemap 一键配置
性能优化	WP Super Cache / W3 Total Cache	页面缓存、CDN 集成
结构化数据	Schema Pro	JSON-LD 自动生成（Article、BreadcrumbList）
图片优化	ShortPixel / Imagify	自动压缩、WebP 转换、lazy load
编辑器	Gutenberg（内置）	所见即所得编辑，销售部门直接使用

7.8 SEO 联动策略

VitePress 官网与 WordPress 文章系统之间的 SEO 需要协同运作：

Sitemap 合并策略：

www.suconnect.com/sitemap.xml          ← VitePress 生成（自动包含 /article/ 列表页）
www.suconnect.com/blog/sitemap_index.xml  ← WordPress + Yoast SEO 生成（包含所有文章详情页）

在 VitePress 的 sitemap.xml 中手动引用 WordPress 的 sitemap：

xml

<!-- 在 VitePress 构建后处理脚本中追加 -->
<sitemap>
  <loc>https://www.suconnect.com/blog/sitemap_index.xml</loc>
</sitemap>

或在百度/Google Search Console 中分别提交两个 sitemap。

内链策略：

从	到	方式
VitePress 列表页	WordPress 详情页	文章卡片链接 `/blog/xxx/`
VitePress 其他页面	WordPress 文章	相关文章推荐模块
WordPress 文章内	VitePress 产品页	文章中嵌入产品链接（如「了解更多请访问速众低代码平台」）
WordPress 详情页	VitePress 首页	导航栏 Logo、面包屑「首页」
WordPress 详情页	VitePress 列表页	面包屑「行业资讯」

7.9 销售部门发文流程

1. 销售登录 WordPress 后台（www.suconnect.com/blog/wp-admin/）
2. 新建文章 → 所见即所得编辑器撰写内容
3. 设置分类（低代码/数字化转型/行业方案等）、标签、封面图
4. Yoast SEO 面板检查 SEO 评分，优化标题/描述
5. 点击「发布」→ 文章即时在 WordPress 上线
6. Webhook 自动触发 VitePress 重新构建 → 列表页同步更新

7.10 成本评估

项目	说明	预估工时
服务器环境	PHP-FPM + MySQL 安装（可与 VitePress 同机部署）	0.5 天
WordPress 安装	WordPress 核心安装、基础配置	0.5 天
Nginx 反向代理	`/blog/` 子目录代理配置	0.5 天
自定义主题开发	复刻官网导航/页脚/配色，文章列表+详情模板	3-5 天
SEO 插件配置	Yoast SEO / Rank Math 安装与全局配置	0.5 天
VitePress data loader	`wp-articles.data.js` + 列表页组件改造	0.5 天
Webhook 构建触发	WordPress 钩子 + CI/CD pipeline 对接	0.5 天
联调测试	跨系统跳转、SEO 验证、响应式测试	1 天
合计		7-9 天

7.11 优势与劣势

优势：

SEO 能力极强：WordPress + Yoast/Rank Math 开箱即用，TDK/OG/JSON-LD/Sitemap 全自动
销售部门零门槛：所见即所得编辑器，无需学习 Markdown 或 Git
发布即上线：文章发布后立即可被爬虫抓取，无需等待构建
与官网解耦：WordPress 独立运行，不影响 VitePress 官网的稳定性
内容管理能力丰富：分类、标签、评论、搜索、多人协作、角色权限
REST API 天然支持：VitePress 构建时可通过 API 自动同步数据
生态成熟：海量主题和插件可用

劣势：

额外运维成本：需要维护 PHP + MySQL 环境，定期更新 WordPress 补丁
主题定制成本：需要开发自定义主题与官网风格统一，官网改版时需同步
安全风险：WordPress 是攻击高发目标，需要定期安全更新和防护
两套系统：技术团队同时维护 VitePress + WordPress

8. 方案 A 备选实施要点（Markdown 文件方案）

8.1 目录结构

src/article/
├── index.md                                    # 列表页（现有）
├── low-code-cost-reduction.md                 # 文章 1
├── manufacturing-digital-transform.md         # 文章 2
├── gov-info-security.md                       # 文章 3
└── ...

8.2 列表页改造

将 CustomArticlePage.vue 中的硬编码数据改为从 Markdown 文件的 frontmatter 自动收集：

javascript

// .vitepress/data/articles.data.js
import { createContentLoader } from 'vitepress'

export default createContentLoader('article/*.md', {
  transform(rawData) {
    return rawData
      .filter(page => page.url !== '/article/')
      .sort((a, b) => new Date(b.frontmatter.date) - new Date(a.frontmatter.date))
      .map(page => ({
        title: page.frontmatter.title,
        description: page.frontmatter.description,
        date: page.frontmatter.date,
        category: page.frontmatter.category,
        tags: page.frontmatter.tags,
        url: page.url,
      }))
  }
})

8.3 销售部门发文流程

1. 销售编写文章内容（Word/飞书/语雀等）
2. 技术人员将内容转为 Markdown 文件，填写 frontmatter
3. 提交到 Git 仓库
4. CI/CD 自动构建部署
5. 文章上线，搜索引擎自动抓取

9. 结论

项目	当前状态	方案 E (WordPress)	方案 A (Markdown)
文章列表页 SEO	⚠️ 基本支持	✅ VitePress 列表 + WP 详情	✅ data loader 构建时渲染
文章详情页 SEO	❌ 不存在	✅ WordPress SSR 渲染	✅ 每篇 Markdown 静态 HTML
文章 TDK	❌ 仅列表页	✅ Yoast/Rank Math 自动生成	✅ frontmatter 配置
结构化数据	❌ 无	✅ 插件自动 JSON-LD	✅ 手动配置 JSON-LD
sitemap 收录	⚠️ 仅列表页	✅ WordPress 自动生成 sitemap	✅ VitePress 自动收录
社交分享	❌ 无	✅ 插件自动 OG 标签	✅ frontmatter 手动配置
销售发文门槛	-	✅ 所见即所得编辑器	⚠️ 需技术人员协助
发布实时性	-	✅ 即时上线	⚠️ 需构建部署

推荐方案 E（WordPress + VitePress 跳转）：WordPress 作为文章管理系统，SEO 生态最成熟，销售部门可以零门槛发文。通过子目录部署（/blog/）共享主域名 SEO 权重，VitePress 构建时通过 WordPress REST API 自动同步文章数据到列表页，文章发布后 Webhook 自动触发重新构建，实现两个系统的无缝联动。

行业资讯栏目 SEO 评估报告 ​

1. 背景 ​

2. 当前技术架构分析 ​

2.1 技术栈 ​

2.2 VitePress 渲染机制 ​

2.3 当前文章页实现方式 ​

3. SEO 支持评估 ​

3.1 文章列表页（/article/）— 基本支持 ​

3.2 文章详情页 — 不支持 ​

3.3 数据来源方式的 SEO 影响 ​

4. 方案对比 ​

方案 A：Markdown 文件方案 ​

方案 B：CMS + 构建时数据拉取方案 ​

方案 C：SSR 服务端渲染方案（不推荐） ​

方案 D：预渲染 + 客户端水合方案 ​

方案 E：WordPress 文章系统 + VitePress 跳转（推荐） ​

5. 推荐方案 ​

首选：方案 E（WordPress 文章系统 + VitePress 跳转） ​

备选：方案 A（Markdown 文件方案） ​

6. 方案综合对比 ​

7. 方案 E 实施要点（WordPress + VitePress 交互） ​

7.1 整体架构 ​

7.2 部署模式选择 ​

7.3 Nginx 路由配置 ​

7.4 WordPress 子目录配置 ​

7.5 VitePress ↔ WordPress 数据交互 ​

交互一：VitePress 列表页链接到 WordPress 详情页（即时生效） ​

交互二：构建时从 WordPress REST API 自动同步文章列表（推荐） ​

交互三：文章发布后自动触发 VitePress 重新构建 ​

7.6 WordPress 自定义主题与官网风格统一 ​

7.7 WordPress SEO 插件生态 ​

7.8 SEO 联动策略 ​

7.9 销售部门发文流程 ​

7.10 成本评估 ​

7.11 优势与劣势 ​

8. 方案 A 备选实施要点（Markdown 文件方案） ​

8.1 目录结构 ​

8.2 列表页改造 ​

8.3 销售部门发文流程 ​

9. 结论 ​

行业资讯栏目 SEO 评估报告

1. 背景

2. 当前技术架构分析

2.1 技术栈

2.2 VitePress 渲染机制

2.3 当前文章页实现方式

3. SEO 支持评估

3.1 文章列表页（/article/）— 基本支持

3.2 文章详情页 — 不支持

3.3 数据来源方式的 SEO 影响

4. 方案对比

方案 A：Markdown 文件方案

方案 B：CMS + 构建时数据拉取方案

方案 C：SSR 服务端渲染方案（不推荐）

方案 D：预渲染 + 客户端水合方案

方案 E：WordPress 文章系统 + VitePress 跳转（推荐）

5. 推荐方案

首选：方案 E（WordPress 文章系统 + VitePress 跳转）

备选：方案 A（Markdown 文件方案）

6. 方案综合对比

7. 方案 E 实施要点（WordPress + VitePress 交互）

7.1 整体架构

7.2 部署模式选择

7.3 Nginx 路由配置

7.4 WordPress 子目录配置

7.5 VitePress ↔ WordPress 数据交互

交互一：VitePress 列表页链接到 WordPress 详情页（即时生效）

交互二：构建时从 WordPress REST API 自动同步文章列表（推荐）

交互三：文章发布后自动触发 VitePress 重新构建

7.6 WordPress 自定义主题与官网风格统一

7.7 WordPress SEO 插件生态

7.8 SEO 联动策略

7.9 销售部门发文流程

7.10 成本评估

7.11 优势与劣势

8. 方案 A 备选实施要点（Markdown 文件方案）

8.1 目录结构

8.2 列表页改造

8.3 销售部门发文流程

9. 结论