如果你想做一个公司官网、个人品牌网站、服务型网站、联盟营销落地页，或者想接单帮客户做网站，但自己又不会写代码，那么今天这个方法非常适合你。

这篇文章会完整演示一种新的 AI 建站流程：先用 Claude AI 快速生成网站设计和页面结构，再把网站导入到 WordPress 里面，最后用 Elementor 这种可视化页面编辑器继续修改、排版和优化。

本期用到的工具

这套流程会用到几个核心工具，建议大家提前准备好。

1. Hostinger 主机和域名

网站想真正上线，就需要服务器和域名。这里推荐使用 Hostinger，主要是因为它对新手比较友好，可以直接安装 WordPress，也可以注册域名。

Hostinger：
https://bit.ly/3BysRqP

2. Claude AI 桌面版

我们需要用到 Claude AI 的桌面版，因为后面要通过 MCP 的方式，把 Claude 和 WordPress 网站连接起来。

Claude 下载地址：
Claude 官方下载
https://claude.com/download

如果你还没有 Claude 账号，或者需要 Claude AI 会员，也可以通过这个平台购买相关 AI 账号或会员服务：

ChatGPT / Claude AI 会员代充、账号购买平台：
https://nf.video/C1dxn

一、使用 Claude 创建网站的提示词

请使用 HTML 为我的业务设计一个完整的 5 页网站。整体风格要现代、简洁、专业。请做出独特的设计，并确保网站设计能够超过我的竞争对手。

• 企业名称：[你的企业名称]
• 我提供的服务：[你的服务内容]
• 我的服务对象：[你的目标客户]
• 网站主要目标：[获取潜在客户 / 预约咨询 / 展示作品]

SEO 关键词：[关键词 1，关键词 2，关键词 3]

请搭建以下 5 个页面：

• 首页（Home） —— 首屏主视觉区（Hero）包含标题 + CTA 按钮、信任背书条、3 个核心优势、服务预览、客户评价、关于我们预览、最终 CTA。
• 关于我们（About） —— 品牌故事、使命、我的差异化优势、CTA。
• 服务页（Services） —— 服务网格与说明、操作流程步骤、常见问题 FAQ、CTA。
• 列表页（Listings：作品集 / 产品 / ） —— 卡片式网格布局，使用适合业务领域的 Unsplash 图片，包含筛选栏和 CTA。
• 联系我们（Contact） —— 联系表单（姓名、邮箱、电话、留言）、联系信息、地图、社交媒体链接。

页眉（Header）：固定吸顶；Logo + 导航菜单（首页、关于我们、服务、列表页、联系我们）+ 联系 CTA 按钮 + 移动端菜单。

页脚（Footer）：Logo、快速链接、联系信息、社交媒体链接、版权信息。

要求：

• 现代、简洁的设计 —— 由你选择最适合我业务的颜色、字体和风格。
• 完全适配手机端，具备响应式布局。
• 所有链接和按钮都要可点击、可正常工作。
• 使用与我的细分领域匹配的 Unsplash 图片。
• 具备 SEO 基础优化：meta 标题、H1、图片 alt 文本、语义化 HTML。

二、完善网站

完善网站，全面检查整个网站，找出所有设计不一致的地方并进行修复。

确保所有链接都能正常使用，并对网站进行调试，排查和修复可能存在的问题。

三、导入网站提示词（仅适用于 Claude 桌面软件）

请为这个设计所创建的页面新建一个菜单，并确保同时设置好首页。

请把这个设计转换成适用于 WordPress 的 Elementor 页面构建器版本。务必使用 Elementor 原生元素，不要使用 HTML 小工具。请使用 Container（容器），不要使用 Inner Section（内部区块）。我已经禁用了 Atomic Editor，请不要使用 Atomic 元素。我们已经安装了 Novamira 插件，它可以帮助你更好地理解如何使用 Elementor 元素。

重要提示：如果你已经安装了 Elementor Pro，不要使用关于 XPRO 插件的提示词，请改用下面这段提示词：

接下来，请使用 XPRO 来设计并创建页眉和页脚。这个插件允许你使用 Elementor 构建自定义页眉和页脚。不要使用 Elementor Pro 小工具，请使用 XPRO 提供的元素。请确保将页眉和页脚模板保存到 XPRO 模板库中，方便我之后继续自定义。

联系页面的联系表单请使用 WPForms。

现在请你把这个网站转换好，并推送到我连接的域名：https://aiyoufeng.com/（改成你的域名）

三、常用术语对照

简单来说就是：
Claude AI 负责快速生成网站设计，WordPress 负责真正上线和长期管理，Elementor 负责后期可视化编辑。

如果你还没有服务器和域名，可以先准备一个建站主机。我比较推荐新手使用 Hostinger，它支持购买服务器、注册域名、安装 WordPress，而且后台操作比较简单，适合没有技术基础的新手。

Hostinger：服务器、域名
https://bit.ly/3BysRqP

如果你在操作过程中遇到问题，或者想系统学习 AI 建站、WordPress、联盟营销、YouTube 变现，也可以加入我的知识星球，向有风咨询：
https://t.zsxq.com/16QP9JP8b

一、为什么用 AI + WordPress 做网站？

传统做网站通常有几种方式：自己写代码、找设计师定制、购买模板，或者直接用建站平台拖拽页面。

但这些方法都有一些问题。

自己写代码对新手来说门槛太高；找设计师成本比较高，而且沟通周期长；购买模板虽然快，但很多网站看起来都差不多，后期改起来也不一定方便。

而现在用 AI 建站，可以先让 Claude AI 帮我们生成一个完整的网站雏形，包括首页、关于我们、服务介绍、联系我们、顶部导航、底部信息、按钮、版面结构等等。然后再把这个设计导入 WordPress，用 Elementor 继续调整。

这样做的好处是：

第一，速度快。以前做一个网站可能要几天甚至几周，现在用 AI 可以先快速生成一个完整版本。

第二，成本低。你不需要一开始就请设计师，也不需要自己会写代码。

第三，后期可控。网站导入 WordPress 后，你可以自己改文字、换图片、调颜色、优化手机端页面。

第四，适合做联盟营销。如果你想做教程站、工具推荐站、产品评测站，WordPress 加 Elementor 的组合非常灵活，后期也方便做 SEO 优化。

二、本期用到的工具

这套流程会用到几个核心工具，建议大家提前准备好。

1. Claude AI 桌面版

我们需要用到 Claude AI 的桌面版，因为后面要通过 MCP 的方式，把 Claude 和 WordPress 网站连接起来。

Claude 下载地址：
Claude 官方下载
https://claude.com/download

如果你还没有 Claude 账号，或者需要 Claude AI 会员，也可以通过这个平台购买相关 AI 账号或会员服务：

ChatGPT / Claude AI 会员代充、账号购买平台：
https://nf.video/C1dxn

2. Hostinger 主机和域名

网站想真正上线，就需要服务器和域名。这里推荐使用 Hostinger，主要是因为它对新手比较友好，可以直接安装 WordPress，也可以注册域名。

Hostinger：
https://bit.ly/3BysRqP

3. WordPress

WordPress 是目前非常主流的网站管理系统，适合做博客、企业官网、个人品牌站、工具站、联盟营销网站等。

它最大的好处是后期可扩展性很强，插件丰富，而且适合做 Google SEO。

4. Elementor

Elementor 是 WordPress 里面非常好用的可视化页面构建器。你不需要写代码，只需要拖拽模块，就可以编辑页面。

如果你想要更完整的页面设计能力，也可以使用 Elementor Pro：

Elementor Pro：
https://bit.ly/4cuQ8IF

5. Novamira 插件

这里需要注意，视频语音里可能会把插件名称识别错。正确名称应该是 Novamira。这个插件的作用可以理解为一个“桥梁”，用来连接 Claude AI 和 WordPress，让 Claude 可以把生成的网站内容导入到 WordPress 里面。

Novamira 插件下载：
https://bit.ly/4tY4TL5

6. Node.js

Node.js 是一个运行环境。安装它之后，可以让 Claude 和 WordPress 之间的连接、导入、转换过程更稳定。

Node.js 官方下载：
https://nodejs.org/zh-cn

三、第一步：下载并安装 Claude AI 桌面版

首先，我们需要下载 Claude AI 桌面版。

打开 Claude 下载页面后，如果你是 Windows 电脑，就选择 Windows 版本；如果你是苹果电脑，就选择 macOS 版本。

Claude 下载地址：
https://claude.com/download

这里一定要注意，我们需要的是 Claude Desktop，也就是 Claude 桌面版，不是单纯在网页里打开 Claude。

为什么一定要用桌面版？

因为后面我们需要通过 MCP，把 Claude 和 WordPress 网站连接起来。你可以把 MCP 理解成一个“接口”或者“通道”。通过这个通道，Claude AI 才能读取和操作你的网站后台，把生成的网站结构导入进去。

安装完成后，打开 Claude 桌面版，登录你的账号，就可以开始下一步了。

四、第二步：用 Claude AI 生成网站设计

接下来，我们要让 Claude AI 先帮我们生成一个完整的网站设计。

你可以准备一段提示词，告诉 Claude：

你的网站是做什么的；
你的企业名称是什么；
你提供什么服务；
你的目标客户是谁；
网站主要目标是获取客户、展示服务，还是预约咨询；
你希望网站是什么风格；
你需要哪些页面；
你想优化哪些 SEO 关键词。

比如，如果你做的是 AI 扫地机器人网站，就可以这样告诉 AI：

企业名称：Windy
提供的服务：AI 扫地机器人、智能清洁解决方案、家庭自动化清洁设备
服务对象：家庭用户、智能家居用户、办公室清洁场景、科技产品爱好者
网站目标：展示产品、获取潜在客户、引导用户咨询或购买
SEO 关键词：AI 扫地机器人、智能扫地机器人、家用清洁机器人、智能家居清洁设备

如果你不知道怎么写这些内容，也可以先让 ChatGPT 或 Claude 帮你补充。你只需要告诉 AI：“我的公司是做 AI 扫地机器人的，请帮我补充企业名称、服务内容、目标客户、网站目标和 SEO 关键词。”

这样生成出来的网站会更贴近你的业务，而不是一个空泛的模板。

五、提示词里要重点写清楚哪些内容？

想让 Claude 生成的网站更专业，提示词不能太简单。

你至少要写清楚下面几个部分：

1. 网站类型

比如你要做的是企业官网、个人品牌网站、产品展示页、联盟营销落地页，还是服务型网站。

不同类型的网站，页面结构是不一样的。企业官网要突出品牌和服务，产品站要突出产品卖点，联盟营销落地页要突出转化按钮和行动引导。

2. 网站风格

你可以告诉 AI：网站整体风格需要现代、简洁、专业、高级、科技感、适合移动端。

如果是 AI 产品类网站，可以强调科技感、未来感、干净的排版和清晰的按钮。

3. 页面结构

常见页面可以包括：

首页
关于我们
服务介绍
产品展示
客户案例
常见问题
联系我们
隐私政策
服务条款

如果你是做联盟营销网站，也可以加入“推荐工具”“教程文章”“购买指南”“资源下载”等页面。

4. SEO 关键词

SEO 关键词一定要写具体，不要只写“网站”“AI”“工具”这种太宽泛的词。

比如你做 AI 建站教程，可以围绕这些关键词：

AI建站
Claude AI建站
WordPress建站教程
Elementor教程
AI做网站
零基础建站
专业网站搭建

这样后面整理文章、布局标题、写页面文案的时候，更容易符合 Google SEO 的方向。

六、网站生成后，先检查整体效果

Claude AI 生成网站后，通常会给你一个 HTML 页面。你可以先打开预览，看看整体效果。

重点检查这些地方：

顶部导航是否正常；
按钮是否能点击；
页面排版是否统一；
图片区域是否合理；
手机版是否适配；
底部页脚是否完整；
隐私政策、服务条款等链接是否存在。

如果你发现某些地方不满意，不需要自己手动改代码，直接继续和 Claude 对话就可以。

比如你可以说：

“请全面检查这个网站，找出所有设计不一致的地方并修复。”
“请确保所有导航链接都可以正常点击。”
“请优化手机版显示效果。”
“请让首页设计更专业，更适合 AI 科技产品网站。”
“请增强 CTA 按钮，引导用户咨询或购买。”

Claude 会根据你的要求继续修改网站。

如果你是做联盟营销网站，这一步特别重要。因为你的网站不只是好看，还要能引导用户点击推广链接、咨询服务、购买工具。

比如你可以在首页、中间内容区和文章结尾自然加入推荐链接：

推荐新手使用 Hostinger 搭建 WordPress 网站：
https://bit.ly/3BysRqP

需要 Claude AI 或 ChatGPT 会员账号，可以看这里：
https://nf.video/C1dxn

如果你想直接用 WordPress 做更专业的页面，可以搭配 Elementor Pro：
https://bit.ly/4cuQ8IF