用 AI 创建页面，就是告诉 AI 你想要一个什么页面，它来排版、配图、写内容，几分钟做出一个草稿页面，你确认后再发布。编辑页面，就是让 AI 只改已有页面里你点名的那一块，其他不动。你只需要在豆包、千问、WorkBuddy、Codex、Claude Code 等 AI 工具里装好 PufferGo 的内容技能（Skill）——做页面 / 文章 / 案例 + SEO 这一个，之后说「帮我做一个页面」就行。
技能（Skill）还没装、网站还没连接？先看《装 PufferGo 技能（Skill）》，安装和授权都在那里。要上产品，见 用 AI 上传网站产品；要写文章、加案例，见 用 AI 发布和管理 WordPress 文章。
一、AI 能帮你做哪些"单个页面"
首页、关于我们、联系我们建站时一般就有了。网站上线之后，你最常需要新建的是下面这些单个页面：
| 页面 | 什么时候要 |
|---|---|
| 产品对比页 | 帮客户在同系列不同型号之间做选择，把客户留在你站内 |
| 广告落地页 | 投 Google、社媒广告时，承接某个产品或活动的流量 |
| FAQ 常见问题页 | 汇总售前疑问，减少反复沟通 |
| 政策 / 信任页 | 运输、质保退换、付款方式、条款、隐私政策 |
| 展会 / 促销页 | 广交会邀请、限时优惠等时效性页面 |
| 资料下载页 | 产品目录、技术文档下载 |
也能改已有页面：换首页某张图、加一个卖点、更新关于我们里的年份和数据。
注意两件事：产品不在这做，用产品技能；解决方案不是单个页面，它是围绕一个主题的一组页面，本篇只讲一个页面怎么做。
技能和自带脚本是开源的，代码在 GitHub：puffergo-wordpress-ai-agent。
二、做页面前，先想清楚三件事
不用你会设计，但动手前把这三件事想清楚，做出来的页面才有用，也省得来回改。下面以本文的案例——NV 系列 LED Wall Pack Light 选型对比页——来说明。
1. 这个页面给谁看，要他看完做什么（目的）。 对比页的读者，是已经在看你壁灯、但不确定该买 30W、60W 还是 100W 的客户。这一页要做的，是帮他当场选对型号、然后发起询盘——而不是让他关掉页面再去搜别家。
2. 这个页面需要哪些内容（素材）。 要对比三款，就得有三款产品的真实参数（功率、光通量、尺寸、适用场所）和图片（产品图、装在现场的场景图、做工细节图）。参数不能凭印象编，没有的先标出来问。
3. 页面从上到下分几块（区块）。 区块的顺序，要顺着客户做决定的过程：先看到标题知道这页讲什么 → 快速扫一眼三款 → 看详细对比表 → 对照自己的使用场景 → 还有疑问看 FAQ → 最后联系我们。下面第三节就把这一页的区块逐个列出来。
三、案例：产品对比页的 9 个区块
按上面的思路，这个对比页从上到下分成 9 块，每块都有明确任务：
| # | 区块 | 作用 | 配图 |
|---|---|---|---|
| 1 | 标题大图 | 一眼说明这页是「NV 系列选型指南」 | 仓库外墙夜景横图 |
| 2 | 引导正文 | 说明三款只在功率和照亮面积上有区别 | — |
| 3 | 三款并排卡片 | 型号 + 功率 + 定位 + 适合场所 | 三张产品方图 |
| 4 | 核心对比表 | 功率、光通量、色温、IP、电压、外壳、尺寸、面积 | — |
| 5 | 场景三段（左右图文交错） | 小 / 中 / 大区域分别对应哪款 | 三张场景图 |
| 6 | 一句话选型 | 按面积小、中、大选 30、60、100 | — |
| 7 | 做工细节 | 压铸铝外壳、IP65、灯珠、支架 | 细节方图成排 |
| 8 | 常见问题 | 支架、质保、调光、电压等疑问 | — |
| 9 | 结尾引导 | 还不确定就发项目，工程师帮选型 + 报价 | 厂房夜景横图 |
做好的页面首屏是这样，标题大图和引导都在：
四、准备图文素材
区块定下来，就按区块准备素材：
- 文字：产品参数、用在哪些场所，用你平时的说法写下来就行，中文也可以，AI 会整理成英文、按区块归位。
- 图片：图片是一个页面的灵魂，尽量多准备、要好看——干净的产品图、有氛围的现场场景图、做工细节特写。图直接放进文件夹、不用逐张标注，AI 会按图片形状自动安排：长方形图适合通栏大图，正方形图适合左右图文或几个一排，交错着排更好看。
- 不懂就问 AI：不知道该准备什么，就直接发一句「我想做一个产品对比页，你告诉我还缺哪些东西」，AI 会一项项问你、带你补齐。
三款并排卡片和核心对比表做好后是这样，参数一目了然，中间最常用的 NV-60 做了高亮：
五、把这段话发给 AI：创建页面（复制即用）
素材准备好，把下面这段真实的话复制给 AI 就行。查图、排版、存草稿、等你说发布，都是技能装好后的默认动作，不用写进去。把产品、区块、图片换成你自己的即可。
“` 帮我用 PufferGo 技能做一个新页面：NV 系列 LED Wall Pack Light 选型对比页，对比 NV-30、NV-60、NV-100 三款。
三款产品的资料和图片在文件夹里，产品图、场景图、细节图都放好了。
页面从上到下分这几块：
- 顶部一张仓库外墙夜景大图，标题写「NV 系列怎么选：30W、60W、100W」；
- 一段引导，说明三款只在功率和照亮面积上有区别；
- 三款并排卡片，每张写型号、功率、定位和适合场所；
- 一张对比表，对比功率、光通量、色温、防护等级、电压、外壳、尺寸、适用面积；
- 三个真实场景，左右图文交错，分别对应小装卸区、标准仓库、大型物流园；
- 一句话选型建议，按面积小、中、大选 30、60、100；
- 做工细节，几张细节图成排；
- 常见问题；
- 结尾放一张厂房夜景大图，引导客户发项目给我们帮选型。
核心关键词：led wall pack light。 长尾关键词：led wall pack light comparison、how to choose led wall pack、warehouse wall pack light、outdoor wall pack light。 “`
场景三段和一句话选型做好后是这样，客户对照自己的场地就能对号入座：
六、看预览，以及编辑页面
看预览：AI 做好后会发给你两个链接——预览链接看前台效果，后台编辑链接想自己改就从这里进。这时页面是草稿，访客看不到。记得电脑和手机两种宽度都看一眼。
做工细节、常见问题和结尾引导在页面下半部分：
编辑页面：直接告诉 AI 改哪里，最好把页面链接一起发给它，比如：
“ 帮我改一下 NV 系列对比页：把对比表里 NV-60 的适用面积改成「40–90 m²」，其他不动。 “
AI 每次改之前会先从网站拉回最新内容，你在后台手动改过的地方不会被覆盖，而且只改你点名的那一块。还在草稿里的页面直接改；已经发布上线的页面，AI 会先给你一个预览链接，你看过说「可以」，它才真正更新到线上。
后台编辑页长这样，每个区块都能点开自己改：
七、页面里能放哪些区块
知道有哪些区块，你就能跟 AI 说清楚想要什么。一个页面通常由这些块拼起来：
- 标题大图：页面顶部一张大图加标题，先把人留住。
- 图文段：一张图配一段文字，图在左或在右。
- 多列卡片：几个内容并排，比如三款产品、三个卖点。
- 表格：参数、对比这类整齐的内容。
- 多图成排：一组细节图、场景图。
- 常见问题：折叠的问答。
- 询盘按钮：引导客户联系你。
AI 生成的这些内容，你在 WordPress 后台都能直接点开改字、换图，不用回头找 AI。轮播、弹窗、表单这类交互，可以在编辑器里加现成组件。
八、几个要知道的
- 不会排版没关系：这正是 AI 干的活，你只管说要什么、好不好看。
- 页面不归分类：页面本身不挂在某个分类下，和文章、产品不一样。
- 网址上线后不轻易改：搜索引擎收录的、别处链过来的都是这个网址，改了旧链接会失效。草稿阶段可以随便改。
- 先草稿、后发布：「推送」「更新」只存草稿，只有你明确说「发布」，页面才公开。
九、常见问题
AI 会不会自己编内容
参数、数据、认证只能来自你给的资料，没有就问你；你没说过的夸话不会写。页面推送前你还能在预览里逐块核对。
页面做好后能自己改吗
能。AI 生成的区块在 WordPress 后台都能点开改；也可以继续让 AI 改，它只动你点名的那一块。
关于「怎么更新技能」「网站插件太旧」「多个网站怎么分开管」「手机上能不能用」这类通用问题，见《装 PufferGo 技能（Skill）》。
下一步
- 页面要放产品，先把产品上好：用 AI 上传网站产品。
- 还没装技能：见《装 PufferGo 技能（Skill）》。