開始之前App 和你的帳號

把 Lovable 轉換為 WordPress 前需要準備什麼

搭載 Apple 晶片的 Mac（M1 或更新），macOS 12 或更高版本。
一個 ChatGPT 帳號。轉換由你自己訂閱中的 AI 完成，所以你不用向我們購買額度或 token。
Lovable 專案，ZIP 或包含原始碼的資料夾均可。取得步驟見下文。
磁碟空間。每個正在執行的轉換會佔用幾 GB。

你不需要提前安裝 Docker Desktop，App 會在需要時自行下載並安裝。免費版可以轉換 3 個網站，每個最多 5 個頁面，足夠把一個小型 Lovable 網站轉換為 WordPress。做客戶專案、轉換更大的網站和 WooCommerce 商店，需要在價格頁面購買 Pro 授權。

安裝 html2wp App

下載 Mac 版 App，開啟 DMG 檔案，把 html2wp 拖進「應用程式」資料夾。本指南中的按鈕名稱與螢幕上顯示的完全一致。

準備環境

在 App 的 Settings（設定）中，點選 Prepare environment（準備環境）。App 會在需要時下載並啟動 Docker，然後載入轉換環境以及 WordPress 和資料庫映像。第一次需要幾分鐘。Mac 可能會要求你輸入密碼，Docker 也會顯示它的授權條款。

html2wp App：首次轉換前，Settings 中的 Prepare environment 按鈕 — 首次轉換前：Settings 中的 Prepare environment 按鈕。

一切就緒後，App 會顯示「Ready to work」，按鈕變為 Repair environment（修復環境）。只有以後環境出問題時才需要用它。

環境已準備好的 html2wp App 和 Repair environment 按鈕 — 環境已就緒，側邊欄顯示 Environment ready。

用 ChatGPT 登入

點選 Connect with ChatGPT（連線 ChatGPT）。App 會顯示一個代碼，點選 Open sign-in page 按鈕會開啟 OpenAI 頁面。在那裡用你的 ChatGPT 帳號登入，並輸入 App 中的代碼。你只在 OpenAI 頁面上輸入密碼，所以 App 永遠看不到它。

在 OpenAI 頁面上用代碼把 html2wp App 登入到 ChatGPT — 在 OpenAI 登入頁面輸入 App 中的代碼。

登入後，選擇 Conversion model（轉換模型）和 Reasoning effort（推理強度），或保留預設值。如果你有 Pro 授權，在 Settings 中輸入金鑰，然後點選 Save & check。免費版不需要金鑰。

已登入 ChatGPT 帳號的 html2wp App，以及模型和推理強度設定 — 已登入的帳號，以及用於轉換的模型選擇。

轉換從 Lovable 到佈景主題

把 Lovable 專案新增到 App

App 需要的是專案的原始檔，而不是線上網址。Lovable 會把專案同步到 GitHub 儲存庫。在 GitHub 上開啟它，用 Code → Download ZIP 下載。你不需要建置專案，也不需要執行 npm install，App 會自己完成。

在 App 中點選 New project（新增專案，⌘N）。在 Output 下保留 HTML WordPress theme，然後選擇 Import a ZIP；如果你已經解壓了專案，就選 Choose a folder。App 處理的是副本，所以你的原始檔案保持不變。

html2wp 的 New project 視窗：輸出為 WordPress 佈景主題，從資料夾或 ZIP 匯入 Lovable 專案 — New project：輸出 HTML WordPress 佈景主題，從 ZIP 或資料夾匯入。

以 HTML WordPress 佈景主題方式匯入 html2wp App 的 Lovable 專案 — 匯入後，App 會確認你的原始檔案沒有改動。

Lovable 轉 WordPress：選擇 Flash 還是 Full

在專案介面中，你可以選擇 App 把 Lovable 網站轉換為 WordPress 的細緻程度。Flash 是預設選項：每個步驟執行一次，大約需要半小時。Full 執行所有檢查，並嘗試修復發現的錯誤，所以大約需要一小時。具體時間取決於頁面數量和 Mac 的速度。

html2wp App 中準備轉成 WordPress 的 Lovable 專案，尚未開始 Flash 或 Full 轉換 — Flash 和 Full 按鈕，以及佈景主題類型：HTML 或 Astro 5。

如果你不需要 WordPress，把類型切換為 Astro 5。App 會建置一個靜態網站，你可以直接從 App 部署到 Cloudflare Pages。

轉換過程

轉換期間，Overview（概覽）分頁會顯示轉換外掛正在處理的步驟，以及它自己完成的修復。大部分時間不需要你參與。無論 Lovable 專案是舊的 React App，還是新的 TanStack Start 專案，App 都會先建置它，在瀏覽器中開啟，並把每個頁面儲存為完整的 HTML。之後才把這些 HTML 轉換成佈景主題。

html2wp App 中從 Lovable 到 WordPress 的 Flash 轉換，顯示進度和 Stop conversion 按鈕 — 正在執行的 Flash 轉換，顯示百分比和下一步。

要暫停，點選 Stop conversion，之後用 Continue 繼續。如果外掛自己在某一步停下，Repair and continue 會讓它修復錯誤並繼續執行。

Lovable 轉成 WordPress 之後：對照檢查網站

Compare（比對）分頁會在桌面寬度（Desktop · 1440）和手機寬度（Mobile · 390）下，把原版的每個頁面和 WordPress 版本並排顯示，並用百分比標出差異。請親自檢視每個頁面。自動檢查能發現大部分差異，但不是全部：有一次轉換中缺了一整個區塊，差異卻只有 0.4%。

html2wp App 的 Compare 分頁：左邊是原版，右邊是 WordPress 版本 — 在桌面寬度下比對一個頁面。截圖來自範例網站。

在 Preview（預覽）分頁中，Open website 會開啟本機 WordPress 網站，WordPress admin 會開啟它的後台。如果你想修改什麼，就在右側的聊天中輸入。幾秒鐘內，修改就會直接顯示在預覽中。然後點選 Make release，App 會按你在預覽中看到的樣子打包佈景主題。

透過聊天修改後的 html2wp App，以及 Make release 按鈕 — 在聊天中修改後，App 會顯示修改數量和 Make release 按鈕。

匯出 WordPress 佈景主題

完成 Lovable 到 WordPress 的轉換後，做好的檔案都在 Exports（匯出）分頁中。在 WordPress theme 旁點選 Save，儲存 ZIP。那裡還有 PDF 格式的轉換報告、原始專案 ZIP，以及 Flash 轉換後的 Astro 5 專案。

html2wp App 的 Exports 分頁，包含 WordPress 佈景主題 ZIP 和轉換報告 — ZIP 格式的佈景主題、轉換報告和原始專案。

在 WordPress 中進入「外觀 → 佈景主題 → 安裝佈景主題 → 上傳佈景主題」，選擇 ZIP 並啟用佈景主題。頁面、部落格、表單、選單、SEO 和重新導向都是佈景主題的一部分，無需外掛即可執行。

如果你希望客戶直接在頁面上點選編輯文字和圖片，可以加裝 Visual Edit 編輯器。如果你更喜歡在終端機裡和 AI 代理一起工作，Claude Code 和 Codex 外掛指南介紹了同樣的轉換。

Lovable 轉 WordPress：在 html2wp App 中逐步完成