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的語料庫很強大。