AI生成主题有个好处就是，只要你的提示词到位，AI模型给力，就可以随心所欲的定制。一共尝试了两种页面内容生成方式：专门针对的ui生成网站 和 生成主题上传，各干千秋，按实际情况选择吧。
第一种：使用针对的主题生成网站
我发现了一个比较好用的专门针对 生成网站ui的网站：。
如果是个人站的话，免费账户可以生成2个站，简单注册一些就可以用了，下面是注册后的页面：
直接按照流程写内容，AI就会帮你生成对应站点了。
这里根据你自己的站点，对站点的描述，写的越详细越好。
然后自行选择图片：
选择站点模板，这些模板应用了你选择的图片，这点我非常喜欢。
再调整字体和背景色：
有电商需求的可以再勾选电商相关项，还有预定，在线客服等相关板块
现在来看看建站成品：
是不是小白很友好，不过后面会需要做一些微调，这个是每个主题都避免不了的，但不妨碍我认可他生成站点的顶级设计。
第二种：用Trea 国际版写主题，自定义样式上传。
我的提示词模板：
portant;word-break: break-word !important;">你是一个精通WordPress主题开发的Claude 3.7，我需要一个新闻主题，具体要求：
portant;word-break: break-word !important;"> 1. **强制文件清单**
portant;word-break: break-word !important;">- index.php（必须包含
portant;word-break: break-word !important;"> - style.css（首行必须包含：Theme Name: Xiaoxin Theme）
portant;word-break: break-word !important;">- sidebar.php（侧边栏基础结构）
portant;word-break: break-word !important;"> - templates/index.php（不能是.html！）
portant;word-break: break-word !important;"> 2. **安全规范**
portant;word-break: break-word !important;">- 所有PHP文件首行添加
portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;"> php if (!defined('ABSPATH')) exit; ?>
3. **功能要求**
- 注册一个名为"文章侧边栏"的小工具区域
- 主内容区宽度设置为70%
生成结果
正确文件结构：
portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;"> xiaoxin-theme-new/
├── style.css
├── index.php
├── sidebar.php
├── functions.php
└── templates/
└── index.php # 关键！从.html改成.php
.css核心代码：
portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;"> CSS
portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;color: rgb(92, 99, 112);font-style: italic;">
.php关键修改：
portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;"> PHP
portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;color: rgb(97, 174, 238);">portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;">
portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;">portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;color: rgb(92, 99, 112);font-style: italic;">// 安全校验（根据你的聊天记录新增）portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;">
portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;">portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;color: rgb(198, 120, 221);">ifportant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;"> (!defined(portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;color: rgb(152, 195, 121);">'ABSPATH'portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;">)) portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;color: rgb(198, 120, 221);">exitportant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;">;
portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;">portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;color: rgb(92, 99, 112);font-style: italic;">// 正确调用模板（根据你的调试过程）portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;">
portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;">portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;color: rgb(198, 120, 221);">includeportant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;">(get_template_directory().portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;color: rgb(152, 195, 121);">'/templates/index.php'portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;">);
portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;">portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;color: rgb(97, 174, 238);">?>
压缩打包防坑指南（真实踩坑总结）
错误操作：直接压缩外层文件夹 → 安装时报"无效的主题文件"
正确姿势：
全选所有文件 → 右键"发送到压缩文件"
必须检查
快速验证方法：双击打开压缩包 → 如果看到的是文件夹而不是文件 → 解压后重新压缩内层文件
六、上传全流程
Step 1：进入后台仪表盘 → 外观 → 主题 → 点击"添加新主题"
Step 2：上传主题拖拽压缩包到上传区域
Step 3：安装验证
主题显示" " ️ 状态显示"已安装",就成功啦
七、前台效果调试
手机端显示问题：文字太小 → 在.css添加：
portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;"> CSS
portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;color: rgb(92, 99, 112);font-style: italic;">portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;">
portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;">portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;color: rgb(198, 120, 221);">@mediaportant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;"> (portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;color: rgb(152, 195, 121);">max-widthportant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;">: portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;color: rgb(209, 154, 102);">768pxportant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;">) {
portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;"> portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;color: rgb(224, 108, 117);">bodyportant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;"> {portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;color: rgb(152, 195, 121);">font-sizeportant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;">: portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;color: rgb(209, 154, 102);">18pxportant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;">;}
}
侧边栏不显示：检查.php是否包含：
portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;"> PHP
portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;color: rgb(97, 174, 238);">portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;"> dynamic_sidebar(portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;color: rgb(152, 195, 121);">'文章侧边栏'portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;">); portant;-webkit-font-smoothing: antialiased;scrollbar-color: var(--common-scroll-color) var(--common-scroll-bg);scrollbar-width: thin;color: rgb(97, 174, 238);">?>
一次没成功安装，就继续和AI聊，聊上10来轮，总归会有结果的。下面分享我的 终极提示词模板：
你是一个主题专家，我需要一个[主题类型]主题，要求：
1.**必须文件**
-.php（包含/）
- .css（首行含 Name: [名称]）
- .php（注册菜单+小工具）
2.**模板规范**
- 所有模板文件必须用.php扩展名
- 模板路径用ry()
3.**安全措施**
- 每个PHP文件首行添加校验
4.**响应式要求
- 移动端隐藏侧边栏
- 图片自动适配屏幕
血泪经验总结：
不要相信AI第一次生成的代码
安装失败先查.css和.php
所有模板文件必须用.php后缀
压缩包结构决定生死
经过多轮调试后，我的站点总算上线啦！还不完美，先上上去，后面再做优化，获得成就感+1！
大家实操可能还会遇到其他问题，可以问我，或者可以尝试“遇事不决问AI”。
一般我都是AI打败AI，这个AI搞不定这个问题，换一个AI继续问，总能解决，我相信AI的语料库很强大。
