开始之前
请准备电脑、现代浏览器、文本编辑器,以及从 Forge Zone 账户下载的 ZIP 文件。保留原始 ZIP,不要直接修改。不要把密码、API 密钥、支付信息或客户隐私数据发送给 AI。
本模板是由 HTML、CSS 和 JavaScript 构成的静态网站。除非商品页面明确说明,否则不包含后端、支付处理或真实的表单提交服务。
解压并打开模板
- 将 ZIP 文件下载到容易找到的文件夹。
- 完整解压 ZIP。Windows 请选择 全部解压,macOS 可双击 ZIP。
- 打开解压后的文件夹,直到看到
index.html和同级的assets文件夹。 - 双击
index.html。如果它在文本编辑器中打开,请选择 打开方式,再选择浏览器。 - 修改前先从头到尾浏览页面,并测试菜单和链接。
- 用文本编辑器打开
README.md和CUSTOMISE.md。
正确的初始结构:
template-folder/
├── index.html
├── assets/
│ ├── css/style.css
│ └── js/main.js
├── CUSTOMISE.md
├── README.md
└── LICENCE.txt正确结果: 浏览器显示完整的演示版式、颜色和示例内容。地址以 file:/// 开头是正常现象,表示页面正在本地打开。
如果只看到纯文字或页面损坏,请确认已经完整解压 ZIP,并且 assets 仍与 index.html 位于同一级目录。
保留原版并创建工作副本
- 保留下载的 ZIP,作为干净的原版。
- 复制解压后的模板文件夹,将副本命名为
website-working-copy。 - 只修改工作副本。不要重命名
index.html、assets/css/style.css或assets/js/main.js。 - 每次进行较大修改前,将工作文件夹复制到独立位置,例如
website-backup-01。 - 使用 UTF-8 保存,并保留真实扩展名,避免保存为
index.html.txt。
正确结果: 你拥有一份未修改的原版和一份工作副本。每次保存后刷新浏览器查看结果。
准备企业信息
准备以下信息。你可以直接用自然语言告诉 AI,无需填写技术表格。
| 信息 | 需要准备的内容 |
|---|---|
| 品牌名称 | 页头和浏览器标签中显示的名称 |
| 主要业务 | 你销售的产品或提供的服务 |
| 目标客户 | 你希望触达的人群 |
| 核心优势 | 客户选择你的真实理由 |
| 产品或服务 | 名称、说明,以及需要公开的价格 |
| 联系方式 | 可公开的邮箱、电话和地址 |
| 主要行动 | 邮件、电话、预约页面或其他真实网址 |
| 网站语言 | 中文、英文、越南语或其他语言 |
| 品牌素材 | Logo、品牌色,以及你有权使用的图片 |
| 证明材料 | 只使用真实数据、评价和认证 |
编辑时可以暂时保留“待确定”,但发布前必须处理完毕。不要把模板中的演示数据或评价当作自己的真实信息。
开始与 AI 协作
向 AI 发送文件
如果聊天工具支持 ZIP,请上传工作副本的 ZIP。否则请上传 index.html、style.css、main.js、CUSTOMISE.md、README.md 和 LICENCE.txt,并说明 CSS 位于 assets/css/style.css,JavaScript 位于 assets/js/main.js。
如果 AI 可以直接操作文件夹,请打开或授权正确的 website-working-copy。要求 AI 先读取文件再修改。截图可以辅助说明视觉问题,但不能代替源文件。
设置网站编辑助手
请附上当前文件,AI 会询问缺少的信息。
查看提示词内容
我购买了 Forge Zone 的静态网站模板,希望把它改成自己的网站。我不懂 编程,请用简体中文按清晰的小步骤协助我。 首先读取我提供的全部文件:index.html、assets/css/style.css、 assets/js/main.js、CUSTOMISE.md、README.md 和 LICENCE.txt。如果我单独发送 CSS 或 JavaScript 文件,请按上述路径理解。告诉我哪些文件已经读取、哪些 仍然缺少。不要猜测缺失文件的内容,也不要立即修改。 请先总结现有页面包含哪些区块、哪些按钮可用、哪些功能只是演示,以及我 必须替换哪些示例信息。然后分成小组询问品牌、服务、联系方式、语言和网站 目标。只询问仍然缺少的信息,并允许我回答“暂未确定”。 整个过程中请遵守: - 保留现有原生 HTML、CSS 和 JavaScript 结构、相对路径,以及直接打开 index.html 的能力。不要引入框架、包管理器、构建流程或新依赖。 - 除非我明确要求,否则保留模板风格。保留响应式、键盘导航、清晰的焦点 样式、可读文字和减少动态效果支持。 - 不要编造数据、评价、认证、价格、地址或企业网址。 - 不要加入追踪、后端、支付或隐藏的表单提交功能。 - 如果可以直接编辑文件夹,只修改工作副本。否则返回完整的替换文件,并 写明每个文件的准确位置。文件内容中不要使用省略号或“其余保持不变”。 - 每次修改后列出改动、查看方法,以及已经测试和未测试的项目。 - 不要发布网站、覆盖线上网站或更改域名设置。 现在先读取文件,并询问第一组信息。
正确结果: AI 能识别真实模板文件,并开始询问你的信息。如果 AI 建议使用框架重做,请再次要求保留现有结构。
替换品牌、文案和联系按钮
向 AI 提供经过确认的企业信息。如果某项信息尚未确定,请让 AI 删除相关说法,或明确标记为待确认。之后在同一对话中使用以下提示词。
个性化全部网站内容
请附上当前文件,AI 会询问缺少的信息。
查看提示词内容
使用本次对话中最新的网站文件。请用以下已确认信息替换演示品牌和文案: 品牌:[品牌名称] 产品或服务:[产品或服务] 目标客户:[目标客户] 核心优势:[已经确认的优势] 语气:[例如:清晰、亲切、专业] 公开联系方式:[邮箱、电话、地址,或“不公开”] 主要行动:[希望访客执行的操作] 网站语言:[语言] 修改前,先列出仍缺少的信息,以及无法证明的演示说法。然后更新页面标题、 元数据、导航、首屏、各区块、行动按钮、联系方式、页脚、图片替代文字和无障碍 标签。保留现有版式和响应式行为。删除无法证明的数据、评价、价格、认证和地点, 不要自行编造。返回所有已改文件的完整内容,并列出已经删除或仍需我确认的 每一项演示内容。
将每个按钮连接到正确位置
请附上当前文件,AI 会询问缺少的信息。
查看提示词内容
检查最新文件中的每个按钮、文字链接、菜单项、邮件链接、电话链接和表单。 先制作表格,列出可见文字、当前目标、是否有效,以及应该使用的目标。 只使用以下已确认信息: 主要行动:[邮箱、电话、预约网址或其他真实网址] 次要行动:[真实网址或“删除”] 社交链接:[真实网址或“删除”] 然后修改文件。邮箱使用 mailto:,电话使用 tel:,外部页面使用安全的 https 网址。保留站内锚点。如果表单没有真实提交服务,请标明它是演示,或改成可用 的联系链接。不要模拟提交成功。返回完整的已改文件和简短的点击测试清单。
按需修改颜色、字体、图片或区块
每次只进行一类视觉修改,并在每次修改后刷新页面。开始新的 AI 对话时,请重新上传最新文件。
安全应用品牌颜色和字体
请附上当前文件,AI 会询问缺少的信息。
查看提示词内容
先读取最新的 HTML 和 CSS。应用以下品牌系统,同时保留模板版式和响应式行为: 主色:[HEX 或 RGB] 强调色:[HEX 或 RGB] 背景色:[HEX 或 RGB] 文字颜色:[HEX 或 RGB] 标题字体:[字体名称或“保留当前字体”] 正文字体:[字体名称或“保留当前字体”] 尽量复用现有 CSS 变量。检查文字对比度、按钮、链接、焦点、悬停、边框、深色 区块和手机视图。设置合理的后备字体;除非我确认拥有授权,否则不要加入付费 字体。返回完整 CSS 文件、必要的 HTML 修改,并指出仍需复核的颜色组合。
用我的图片替换 Logo 或插图
请附上当前文件,AI 会询问缺少的信息。
查看提示词内容
我会上传最新网站文件和自己的图片。这张图片将用于 [LOGO / 首屏 / 区块名称], 并且我有权使用它。 修改前先检查当前图片容器。告诉我建议的文件名、格式、尺寸和准确文件夹。然后 使用相对路径更新相关 HTML 和 CSS。保持宽高比,避免布局跳动,编写准确的替代 文字,并确保桌面、平板和手机上都清晰可读。不要在未告知我的情况下裁掉重要 内容。返回完整的已改文件,并准确说明图片应放在哪个位置。
翻译整个网站
请附上当前文件,AI 会询问缺少的信息。
查看提示词内容
把最新网站中访客能看到的全部文字翻译成 [目标语言]。包括元数据、导航、标题、 正文、按钮、标签、表单提示、图片替代文字、无障碍标签和页脚。 除非我提供替代内容,否则保留品牌名、注册产品名、邮箱、电话和网址。保持 HTML 结构、class 名称、ID、路径和 JavaScript 行为不变。使用自然表达,不要逐字硬译。 修改后检查 360 像素宽度和桌面端是否有文字溢出。返回完整的已改文件,并列出 任何需要我确认含义的句子。
添加或删除服务或区块
请附上当前文件,AI 会询问缺少的信息。
查看提示词内容
使用最新网站文件。我希望 [添加 / 删除] 以下项目或区块: [描述服务或区块,并提供已经确认的内容]。 先找出完整 HTML 区块和相关 CSS 或 JavaScript,并说明最小且安全的改动。修改后 不要留下空容器、失效锚点、无用导航链接或 JavaScript 错误。保持间距、视觉层级、 响应式、键盘操作和减少动态效果支持。如果新增项目导致版式不均衡,请调整现有 网格规则,不要复制随意的样式。返回完整的已改文件和桌面、手机检查清单。
发布前检查
请在窄屏手机、平板和宽屏桌面尺寸下测试网站。检查导航、全部链接、文字可读性、图片加载、键盘焦点和减少动态效果。
审核最终网站
请附上当前文件,AI 会询问缺少的信息。
查看提示词内容
审核最新网站文件,作为发布前的最终检查。在报告问题之前不要修改。 请检查:缺失文件和失效的相对路径;残留的演示品牌、示例文字、占位价格、虚假 评价和占位网址;页面标题和描述;标题层级;图片替代文字;标签;键盘导航和清晰 焦点;颜色对比度;菜单和按钮行为;360 像素宽度是否横向溢出;平板和桌面版式; 减少动态效果;控制台错误;外部链接;mailto 和 tel 链接;表单是否只是假装提交。 将问题分为“阻止发布”“应该修复”和“可选优化”。每项写明文件及准确文字或选择器。 等我确认后,再修复前两类问题,返回完整的已改文件和人工测试清单。不要发布网站。
上传网站文件夹并发布
选择支持静态网站的托管服务。上传工作文件夹中的内容,让 index.html 位于发布根目录。不要只上传 HTML,assets 文件夹也必须一同上传。
分步骤协助我发布网站
请附上当前文件,AI 会询问缺少的信息。
查看提示词内容
请指导我把这个静态 HTML/CSS/JavaScript 网站发布到 [托管服务商]。我不懂编程。 只有在确定时才使用服务商当前界面上的按钮名称;如果不确定,请告诉我应该寻找 什么功能,不要猜测界面文字。 我的网站文件夹包含 index.html 和 assets 文件夹。先询问我在托管控制台中能看到 什么,以及我是手动上传、使用 Git 仓库,还是使用服务商命令行。之后每次只给一个 小步骤。准确说明要上传哪一层文件、如何判断部署成功,以及在哪里找到公开网址。 不要向我索取密码、API 密钥、恢复码或支付信息。在我提出要求前不要修改域名设置。 最后检查首页、CSS、JavaScript、图片、链接、手机布局和 HTTPS。
正确结果: 公开网址显示的页面与本地工作副本一致,CSS、JavaScript 和图片都能正常加载。
按需连接自定义域名
先在托管服务商提供的临时网址上确认发布成功,再连接域名。DNS 更新可能需要时间,请在等待期间保留可用的部署版本。
按真实配置连接域名
请附上当前文件,AI 会询问缺少的信息。
查看提示词内容
请帮助我把自定义域名连接到已经发布在 [托管服务商] 的静态网站。我的域名由 [域名或 DNS 服务商] 管理。 不要编造 DNS 值。先让我复制托管服务商显示的准确域名说明,包括记录类型、名称 或主机、目标或值,以及是否需要 www 记录。提醒我隐藏账户 ID 或私人令牌。将这些 说明与我当前看到的记录进行比较,每次只解释一项修改。替换现有记录前必须提醒我, 不要让我删除与邮箱有关的 MX 或 TXT 记录。修改后,指导我验证根域名、www 版本、 HTTPS 证书和重定向行为。
安全更新和恢复
为每个已发布版本保留一份确认可用的备份。在新的工作副本中修改,先本地测试,再发布变更后的文件。
只更新一处并保留其余内容
请附上当前文件,AI 会询问缺少的信息。
查看提示词内容
读取我上传的最新线上源文件。只修改以下项目: [准确描述需要更新的内容]。 保留其他已经确认的文案、链接、版式、颜色、响应式规则、无障碍行为和文件路径。 修改前指出需要修改的文件和最小代码区块。修改后返回完整的已改文件,总结准确 差异,并告诉我如何在本地测试。不要发布,也不要更改域名设置。
查找并修复网站问题
请附上当前文件,AI 会询问缺少的信息。
查看提示词内容
请帮助我诊断静态网站的问题。我会上传最新文件并提供: - 预期结果:[预期结果] - 实际情况:[实际结果] - 出现位置:[页面、区块、设备、浏览器] - 开始时间:[最近一次修改] - 浏览器错误:[准确错误或“没有看到”] 提出修复方案前先读取文件。找出最可能的原因,并指出代码证据。优先使用最小修复, 不要重写网站或添加依赖。保留当前设计和响应式规则。返回完整的已改文件,并提供 一个简短测试以确认问题已经解决。如果证据不足,只询问一张具体截图、一条控制台 信息或一个文件,不要猜测。
快速排查表
| 问题 | 首先检查 |
|---|---|
| 页面没有样式 | 确认 assets/css/style.css 存在,且 HTML 路径未改变 |
| 图片不显示 | 检查文件名、扩展名、大小写和相对路径 |
| 按钮无反应 | 检查真实 href 或 JavaScript,并删除演示行为 |
| 手机页面过宽 | 查找固定宽度,并在 360 像素下测试 |
| 修改没有显示 | 保存正确文件,并强制刷新浏览器 |
| 发布后显示 404 | 将 index.html 放在发布根目录,并检查托管设置 |
| AI 修改过多 | 恢复备份,并用 Prompt 11 提出更精确的要求 |
最终检查清单
- 原始 ZIP 和一份确认可用的备份已安全保存。
- 所有演示品牌、文案、数据、评价、价格和网址均已替换或删除。
- 页面标题、描述、联系方式、链接和行动按钮正确。
- 每张图片都能加载,并有合适的替代文字。
- 网站在 360 像素、平板和桌面尺寸下均无横向溢出。
- 菜单、按钮、键盘焦点和减少动态效果正常工作。
- 没有表单伪装提交,也没有承诺不支持的功能。
- 公开网址能正确加载 HTML、CSS、JavaScript、图片和 HTTPS。
- 下次修改前,已经备份最新的线上源文件。