1小时 AI 建外贸独立站完整教程

建站这事儿，别再自己一点点“手搓”了。用livecanvas 1小时建站，能帮你省下大把时间和精力，让你的网站又快又好。

用AI和WordPress搭建外贸独立站，你需要完成以下几个步骤：基本设置，然后添加基础网页（页首页脚、基础页面、修改页面）和文章管理（写文章、文章单页模板、文章列表页）。

一：基本设置

第 1 步：WordPress 设置

语言切换

第一次登录WordPress，后台默认是英文，看着头大？登录WordPress后台，先进入Users → Profile → Language → 简体中文 → Update Profile。切换之后，整个后台的语言是中文，前台还是保持英文。

站点标题和副标题

改完语言，别忘了改“站点标题”和“副标题”。左下角 设置（setting） 中，修改 站点标题 和 副标题，保存更改。你可以让 AI 帮你去写个网站的标题。

固定链接

点击 固定链接 ，在固定链接做如下设置，固定链接结构：文章名，保存更改。这样你发布的每篇文章的网址都会包含文章标题，方便搜索引擎抓取，也让访客知道这个链接是关于什么的。

对搜索引擎的可见性

点击 设置 ，在 阅读 下，设置 对搜索引擎的可见性 选中 建议搜索引擎不索引本站点，保存更改。这一步是为了在你网站还没完全建好之前，避免搜索引擎收录半成品或者测试内容。等网站全部OK了再取消勾选。

切换网站前后台

点击网站 左上角 的 小房子 ，随时在前台和后台之间切换，看看你的网站长啥样。

第 2 步：熟悉插件功能

安装插件

插件 → 添加插件 → 上传插件 → 选择文件 → 插件压缩包→ 立即安装→启用插件，需要插件文件可以私信我或者去官网下载。

Frontend Editor → License → 激活 livecanvas

设置插件

livecanvas 配置

按以下设置打钩✅ → Save Settings

第 3 步：创建页面

删掉多余的页面，清空回收站

页面 → 所有页面 → 选择所有页面 → 批量操作 移至回收站

回收站 → 选择所有页面 → 清空回收站 （避免链接后缀被占用）

点击左侧，页面 → 添加页面，输入标题，Enable the LiveCanvas Editor 选择 Yes，Home并发布

继续创建 About 、 Contact 和 Blog 页面

Blog页面 Enable the LiveCanvas Editor 选择No

第 4 步：修改主题

安装主题

外观 → 主题 → Download and activate the latest Picostrap5 Theme

picostrap Blank Child Theme → Download and Activate → Activate & Proceed

第二种方案：下载主题

https://picostrap.com/#downloads

picostrap5 Theme 和 picostrap5 blank child theme。

picostrap 主题 （免费入门主题）：「 外观 → 主题 → 添加主题」

挨个上传 .zip 文件 ，不要解压缩，不能两个一起上传

两个主题都安装完成后，启用 picostrap5-child-base 子主题

设置主题

仪表盘 → 外观 → 自定义 ，等待加载完成再去设置，点击 Global Utilities

按以下设置打钩✅，点击 发布

主页设置 → 选择 一个静态页面 → 设置主页为 Home ；文章页为 Blog ；最后点击 发布

第 5 步：AI Settings

申请OpenRouter API

OpenRouter 是一个通过单一 API 无缝接入多种 AI 模型的平台，让您能灵活选择最适合需求的模型。我们已精心筛选并测试了适用于 LiveCanvas 内编程的顶级 OpenRouter 模型，将其集成至 AI 助手和截图转代码功能中，确保生成高质量、高效的 HTML、CSS 和 JavaScript 代码，满足现代网页开发需求。OpenRouter官网地址：https://openrouter.ai/

AI Assistant设置

一次性定义您的内容风格和细节，AI 助手将保持您网站写作的一致性和清晰度。无需重复指令，节省您的时间并确保每段文字都与品牌保持一致。

填写OpenAI API Key

填写OpenRouter API Key

填写Website Information

网站/业务的内容。您可能需要提供公司信息，如服务项目、营业时间、地址、常见问题、希望使用的语言和语气。

就像我之前，用AI建站几乎是全程搞定，从选品、品牌名、域名、logo设计、网站配色，到Landing Page结构、文案撰写，甚至AI作画、AI视频制作，连Google Ads都让AI帮忙了，效率高得不是一点点 。

二：基础网页

第 1 步：页首页脚

Frontend Editor → Launch Header Editor

Edit HTML → 选中所有的代码 → 删除 → Close

Add Section → READYMADES → LiveCanvas Library → Headers

选择一个模板点击，加载header模板，Save。

同样的操作，Frontend Editor → Launch Header Editor，Edit HTML → 选中所有的代码 → 删除 → Close，Add Section → READYMADES → LiveCanvas Library → Footers，加载footer模板，Save。这样，你的网站就有头有脸了。

第 2 步：基础页面

EXIT → 页面 → Home 首页 → Edit in Frontend → Yes, browse templates → Homepages

再次进入Readymade Pages Library：Options → Readymade Pages Library → Homepages

选择一个模板点击，加载模板，Save。

同样的操作，加载About 和 Contact 模板。

第 3 步：修改页面

在页面里选中你要编辑的模块

方法一：打开编辑页面左上角 Universal Selection 按钮，选择所需修改的模块，鼠标左击展开选项。

方法二：点击页面右上角 Tree View ,下滑找到需要编辑的模块（点击选中的模块会有虚线框中表示出来）。鼠标右击展开选项 。

修改模块

部分文案，可以直接点击就可以修改。

可以</>HTML Editor... 进行直接修改。

也可以选择Al Assistant...，利用Al Assistant进行修改。点击上方选择你想要的脑子模型，Contexts to include 选中WEBSITE INFORMATION。可以直接利用Readymade Prompts进行修改，也可以输入指令修改的文案或者图片等。

例如：

修改页眉，左边是 logo，点击后进入我的网站：home：/
中间是菜单，菜单要放在中间，
我的页面链接是：
1、Home: /
2、About: /about
3、Contact：/contact
4、Blog：/blog
右边是按钮，按钮内容是Get Quote

更多关于AI助理的内容可以访问：

修改图片，点击图片，在左边点击 upload/local，进入媒体库选择好图片，点击右下角的choose this image。

选好图片，然后在 Choose Format 里设置好图片尺寸大小

三：文章单页和模板

第 1 步：写文章

对于外贸独立站，内容尤其是博客文章非常重要，是吸引流量的关键。仪表盘 → 文章 → 添加文章 → 输入文章标题、文章内容、设置特色图片 → 发布

每次修改后，务必点击更新

修改文章后缀，为了让文章链接更规范，你可以在文章编辑页面修改文章后缀。

多写几篇文章，这样你的博客列表页看起来会更丰富，也方便你后面调整文章列表页的样式。

第 2 步：文章单页模版

文章单页模板是为了控制你每篇文章的展示样式。

Frontend Editor → Dynamic Templates → Add New Dynamic Template

Singular → 勾选 Single 文章 → 发布。你可以在这里编辑文章的布局和元素。

第 3 步：文章列表页

文章列表页则是展示你所有文章的地方。

Frontend Editor → Dynamic Templates → Add New Dynamic Template → Specialty 勾选 Blog Posts Index，然后发布。

Edit in Frontend → Add Section → READYMADES → LiveCanvas Library → Dynamic Post Loops

选择一个模板点击，加载模板，Save，你的博客列表页就有了。

如需要修改文章单页模板和文章列表页模板，可以参照 修改页面 。

利用AI和WordPress，从建站到内容管理都能实现高效化，让外贸独立站搭建和优化不再是难题。欢迎关注了解更多LiveCanvas AI的使用技巧,一起探索AI建站的无限可能。