Divi 子主題推薦精選 7 款:含 WooCommerce 電商模板,一鍵套用快速開站
挑 Divi 子主題,別再比頁面數量。真正該看的是三件事的交集:頁面類型有沒有覆蓋你要的需求、是否原生串接 WooCommerce 或 LearnDash、以及能不能在 Divi…
挑 Divi 子主題,別再比頁面數量。真正該看的是三件事的交集:頁面類型有沒有覆蓋你要的需求、是否原生串接 WooCommerce 或 LearnDash、以及能不能在 Divi 5 新架構下正常運作。商用長期建議直接買 Divi Marketplace 上的付費款並綁終身會員,例如 Divi Ecommerce、DiviCommerce、Molti、Avanti、Divi eLearn 等,根據各子主題在 Divi Marketplace 的商品頁說明,頁面數從 2 個首頁到 40 餘頁不等。
重點先看:挑子主題比的是頁面類型覆蓋度+外掛串接成熟度+Divi 5 相容性,不是頁面數;根據 DiviCommerce 商品頁的標示,它一套約 23 個頁面、6 個首頁,但用不到的版型反而要砍掉整理。
主流的 Divi 子主題共 7 款,從 WooCommerce 購物網站、品牌形象、個人履歷到線上課程平台一次覆蓋。如果你對 用 Divi 架站 還很陌生,可以先把清單當採購參考;如果你已經在用 Divi 5 新架構,重點要放在相容性這條件上。每一段都會講清楚它適合誰、不適合誰,不會只列優點。
Divi 子主題依附在 WordPress 之上,而 WordPress 目前已是全球最大宗的內容管理系統。根據 W3Techs 的調查,WordPress 被用在 41.5% of all websites,在內容管理系統已知的網站中占比更高達 59.2%,這也意味著以 WordPress 為基礎的 Divi 生態圈,背後是一個極為龐大的站長人口 [來源:W3Techs〈Usage Statistics and Market Share of WordPress〉 https://w3techs.com/technologies/details/cm-wordpress 2026-06-29]。
Divi 子主題是什麼?跟 Divi 主題、Divi 版型庫差在哪
Divi 子主題是依附在 Divi 父主題之下的獨立設計層,它預先將頁首頁尾、首頁排版、WooCommerce 頁面等版型都做好,站長一鍵套用後只需換圖換字就能上線。它在概念上繼承父主題的所有功能,你的 CSS 與功能改動都寫在子主題裡,Divi 主題更新時不會被覆蓋掉。
這裡要釐清一個常被混淆的說法。在 Divi Marketplace 的生態圈裡,「子主題」幾乎被當成「整站模板」的代名詞,一次套用就是整批頁面。但嚴格來說,子主題跟 Divi 版型庫 屬於不同層級的東西,混為一談會在採購階段就做錯決定。
- 子主題(child theme):管整站結構與功能,包含頁首頁尾、全域設定、外掛頁面覆寫,是「整站套版」。
- 版型庫(layouts):管單頁視覺,一次只匯入一頁,不管整站結構,Divi 佈局版型 多半屬於這類。
說白了,子主題真正的價值在於它把頁首頁尾、WooCommerce 結帳、響應式斷點這些容易出錯的工程細節預先處理好。很多新手站長以為省下的是「設計時間」,其實省下的是反覆調 CSS、調手機版排序的除錯時間。頁首頁尾的全域統一、結帳頁的欄位排序、行動裝置斷點的堆疊順序,這些都是套版時最容易翻車的工程活,子主題作者已經替你踩過坑。如果你手機版一直跑版,先看 Divi 手機版排序調整 就知道這有多煩。
為什麼不能直接改 Divi 父主題?因為主題更新維護時,你直接寫進父主題檔案的修改會被還原成初始狀態。把樣式寫進子主題,更新時才不會被洗掉,這也是 WordPress 備份 之外另一層保險。底下挑子主題時我會用三個判準,先講方法論。
挑 Divi 子主題的三個判準:頁面類型、外掛串接、相容性
面對一堆 Divi 子主題,挑選標準要看三個條件的交集:頁面類型是否涵蓋你的網站需求、是否原生支援你要的外掛、以及是否相容於目前 Divi 主題版本(尤其 Divi 5 新架構)。三個都過,才值得花錢。任何一個環節漏掉,後面就會用工程時間來還債。
這裡要先講我為什麼反對用「頁面數」當主指標。多數推薦文把「頁面數量多」當成賣點,但頁面數膨脹只代表你套用後要砍掉一堆用不到的版型、整理成本更高。你需要的是「用得到的那幾頁設計得好」,是幾十頁用不到的版型。一個把購物車、結帳、我的帳號都做好的 12 頁子主題,對電商站長的價值遠高於一個有 40 頁但缺結帳頁的形象款。
| 判準 | 為什麼重要 | 怎麼確認 | 不過的代價 |
|---|---|---|---|
| 頁面類型覆蓋度 | 決定你套用後要不要自己補頁 | 看商品頁是否列出首頁、關於、聯絡、商品頁、結帳等 | 缺哪頁就得自己用 Divi Builder 從零拉 |
| 外掛原生串接 | 決定能不能少裝一層外掛或少改 CSS | 確認是否標示支援 WooCommerce / LearnDash | 結帳頁欄位、課程頁版面全靠自己套版 |
| Divi 5 相容性 | 舊子主題在新架構下未必即插即用 | 看更新日誌是否註明支援 Divi 5 | 撞到架構差異只能等作者更新或自己拆 |
第二個判準,外掛原生串接,最常被忽略。舉個例子,如果你要開 WooCommerce 結帳頁客製化,子主題如果原生覆蓋購物車、結帳、我的帳號這些標準頁面,你就不必另外設計;反之你得自己套版,還要處理 結帳欄位編輯。LearnDash 課程頁也是同樣道理,課程內容、課程資訊、立即購買按鈕這些元素的擺放位置,原生串接的子主題已經幫你排好。
第三個判準是 Divi 5 相容性。根據 Elegant Themes 官方發布的 Divi 5 說明文件,Divi 5 改寫了底層架構,部分舊子主題需要等作者更新才能正常運作,購買前務必確認商品頁是否標示支援 Divi 5,不要寫死在特定版本號上。這也是我建議優先在 Marketplace 買付費款的原因:來路不明的免費子主題沒有更新維護紀錄可查,撞到 Divi 5 出問題只能自己拆。
換個角度想,這三個判準其實對應了三種成本:覆蓋度不夠你要花時間補頁、串接不夠你要花時間改 CSS、相容性不足你要花時間等更新或自己修。把這三種成本加起來,比單看定價誠實多了。一款標價較高但三項都過的子主題,總持有成本往往低於一款便宜但你得自己補兩個月的款。
七款子主題快速對照表
為了讓你在讀各款細節前先有全景,底下用一張總表把七款子主題的定位、規模、外掛串接與適合情境並排。這張表只列可查證的規格與定位,不列無法核實的精確銷量或市占。
| 子主題 | 定位 | 規模概估 | 原生外掛串接 | 適合情境 |
|---|---|---|---|---|
| Divi Ecommerce | 轉換率導向電商 | 約 2 首頁、頁面較精簡 | WooCommerce | 消費品、數位商品 |
| DiviCommerce | 版型彈性電商 | 約 23 頁、6 首頁、5 組頁首 | WooCommerce | 運動品牌、傳統產業 |
| Molti | 品牌形象、預約 | 15 頁以上、6 組頁首頁尾 | 部分 | 商業諮詢、預約型 |
| Avanti | 形象+電商混合 | 40 頁以上、8 首頁 | WooCommerce 完整 | 品牌站兼賣商品 |
| Divi Business | 專業服務入門 | 6 頁 | 無主打 | 律師、醫療、免費起點 |
| Divi Resume | 個人履歷 | 作品集+聯絡表單為主 | 無主打 | 接案者、設計師、顧問 |
| Divi eLearn | 線上課程 | 20 頁以上、含課程元素區塊 | LearnDash | 學校、培訓中心、開課者 |
這張表是挑選的起點,不是終點。規模概估來自各商品頁的公開說明,實際套用後你多半還會刪掉用不到的頁面,所以別被頁面數牽著走。接下來依路線分群細講。
電商路線的兩款主力:Divi Ecommerce 與 DiviCommerce
做 WooCommerce 購物網站,Divi Ecommerce 跟 DiviCommerce 是兩款主力,差別在設計調性。Divi Ecommerce 走現代簡約風,適合多數消費品與數位商品;DiviCommerce 風格偏硬派,頁面數更多,適合傳統產業或運動品牌這類需要強烈視覺的電商。
挑 WooCommerce 路線之所以值得,是因為 WooCommerce 本身已是市占最高的電商系統。根據 W3Techs 的調查,WooCommerce 占了 48.6% of all e-commerce systems in our surveys,整體則涵蓋 8.2% of all websites,等於過半數的電商網站都跑在 WooCommerce 上,挑能原生串接它的 Divi 子主題,等於站在最大的生態圈裡 [來源:W3Techs〈Usage Statistics and Market Share of WooCommerce〉 https://w3techs.com/technologies/details/cm-woocommerce 2026-06-29]。
兩者都吃 WooCommerce,也都覆蓋了 WooCommerce 官方文件所定義的購物車、結帳、我的帳號這些標準電商頁面。差別在設計風格與可替換的佈局數量。底下這張表把量化差異攤開來:
| 項目 | Divi Ecommerce | DiviCommerce |
|---|---|---|
| 設計風格 | 現代簡約 | 硬派、強烈視覺 |
| 首頁數 | 約 2 個 | 約 6 個 |
| 總頁面數 | 較少,主打轉換 | 約 23 個 |
| 頁首可抽換 | 有限 | 約 5 組頁首 |
| 內建行銷元素 | 倒數計時器、電子報表單、A/B 測試 CTA | 彈跳視窗、搜尋欄、可變商品欄位 |
| 適合 | 追求轉換率的一般電商 | 傳統產業、運動品牌等硬派電商 |
Divi Ecommerce 的優勢在轉換率工程。它首頁用滑塊先抓住目光,再展示特色與熱門產品,下方還有倒數計時器製造緊迫感,並內建電子報訂閱表單讓你接 Bloom 電子報,最後能跑 A/B 測試決定哪個 CTA 成效最好。內建電子報表單這件事值得特別看重:電子郵件行銷在多數行銷人眼中仍是投資報酬率最高的管道之一,而分眾經營又是拉高成效的關鍵。根據 HubSpot 的統計,分眾電子報帶來的開信率比未分眾高出 30%、點擊率高出 50%,各行業平均的電子報點擊率則在 2.5% 上下 [來源:HubSpot Marketing Statistics〈HubSpot Email Marketing Benchmarks / State of Marketing Report〉 https://www.hubspot.com/marketing-statistics 2025/2023]。子主題預先把訂閱表單做進首頁流量入口,等於替你把名單收集的漏斗先架好,後續分眾經營才有素材可用。對純粹想把商品賣出去、不太在意版型替換彈性的站長,這套直接到位。它的版型少而精,套用後幾乎不用砍頁面,維護成本低。
DiviCommerce 的優勢在版型彈性。根據 DiviCommerce 商品頁的標示,它有約 23 個頁面、6 個首頁、5 組頁首可抽換,你可以把不同頁面重新組合成新設計。代價是頁面數多,套用後你得花時間砍掉用不到的版型。說實在的,如果你只是開一個小品項的數位商品站,DiviCommerce 對你來說會嫌太重。它的彈性要透過整理才能變現,沒整理反而變負債。
挑選依你的品牌調性而定,與頁面數無關。硬派視覺選 DiviCommerce,現代極簡選 Divi Ecommerce。如果你想先把 WooCommerce 整體跑起來,可以先看 WooCommerce 購物網站架設 跟 WooCommerce 佈景主題推薦,確認方向再回來挑子主題。商品頁面想進一步做 SEO,可搭配 WooCommerce 商品頁 SEO。
形象與多用途:Molti、Avanti 與免費的 Divi Business
做品牌形象或公司官網,付費的 Molti 與 Avanti 是主力,差別在頁面規模。想先零成本試水,免費的 Divi Business 就能做出專業感,特別適合律師、牙醫這類需要穩重形象的專業服務。
Molti 走現代感路線,根據 Molti 商品頁的標示,頁面超過 15 個,搭配 6 組頁首頁尾佈局,原生把響應式版面佈局好。你可以拿它做商業諮詢、品牌形象、預約型網站,每個模塊還自帶動畫效果。一鍵套用、換圖換字,就能快速上線一個 品牌官網。對預約型網站,它跟 品牌形象網站實戰 的做法可以互相參考。
Avanti 是頁面規模最大的一款。根據 Avanti 商品頁的標示,它有 40 個以上的頁面、8 種首頁,並與 WooCommerce 完整串接。WooCommerce 基礎頁面它至少各有兩個以上的設計可選。這代表 Avanti 適合「形象+電商」混合型網站:你要同時有品牌頁面又能賣東西,它一次包辦。規模大也意味著整理時間長,套用前先想清楚哪些頁面真的用得到。
| 項目 | Molti | Avanti | Divi Business |
|---|---|---|---|
| 定價 | 付費(會員享折扣) | 付費(會員享折扣) | 完全免費 |
| 頁面數 | 15 個以上 | 40 個以上 | 6 個 |
| 首頁數 | 多組 | 8 種 | 單一風格 |
| WooCommerce 串接 | 部分 | 完整 | 無主打 |
| 適合 | 品牌形象、預約網站 | 形象+電商混合 | 律師、醫療等專業服務 |
Divi Business 是免費入門款,6 個專業頁面,內建價格表與團隊成員模組,還有帶懸停效果的 Blurb 模塊。它簡約素色,給人專業可靠的形象。老實說,以一款免費子主題而言,它的完成度出乎意料地高,律師、牙醫這類不需要花俏視覺的專業服務,裝下去幾乎不用改。如果你想先試風格再決定要不要花錢,它是 CP 值最高的起點。
免費款適合先試水確認風格,確定方向後再升級到付費款取得更多頁面與更新支援。這段過程你也可以順手整理 頁首設計套版 跟 標題樣式設計,讓品牌辨識度更一致。
特殊用途:Divi Resume 履歷與 Divi eLearn 線上課程
如果做的是個人履歷或線上課程網站,Divi 有對應的利基子主題。Divi Resume 專做個人履歷與作品集,重點在聯絡表單與作品展示;Divi eLearn 專門串接 LearnDash 外掛,能自訂課程頁面佈局,甚至禁用 LearnDash 預設課程頁,適合架設線上課程平台。
Divi Resume 的核心是「讓人找得到你」。它有作品集模板展示服務項目、經驗、技能,搭配聯絡表單與突出聯絡資訊的模塊,讓潛在客戶與雇主能輕鬆聯絡。必備頁面含關於我、聯絡我、作品集、部落格(左側欄、右側欄、全寬三種)、404 頁面。如果你要把作品集做得更突出,可參考 Divi 作品集頁面設計。
Divi eLearn 是針對 LearnDash 量身打造,根據 Divi eLearn 商品頁的標示,包含 20 個以上的頁面模板與 LearnDash 課程元素區塊。它最大的特色是能禁用 LearnDash 原生課程頁,把課程內容、課程資訊、立即購買按鈕等元素放到任意頁面,等於把課程頁面的版面主導權完全還給你。這對想自訂 WordPress 線上課程 平台的站長來說是關鍵能力。
- Divi Resume:作品集模板+聯絡表單+突出聯絡資訊,適合接案者、設計師、顧問建立個人品牌。
- Divi eLearn:與 LearnDash 課程元素串接、可禁用原生課程頁,適合學校、培訓中心、個人開課者。
這兩款都是利基型子主題,需求明確就直接鎖定它們,不必在多用途款裡硬湊功能。想開課但還沒決定平台的人,可以先讀 線上課程平台比較 跟 線上教學網站架設,再回來判斷 LearnDash 路線適不適合你。
Divi 子主題怎麼安裝與套用(含換掉舊子主題)
Divi 子主題的安裝跟一般 WordPress 主題一樣:後台「外觀 → 佈景主題 → 安裝」上傳 zip 檔並啟用即可。要換掉舊子主題,直接在主題列表停用刪除,或透過 FTP 刪除子主題資料夾,父主題 Divi 不受影響。
安裝前提只有一個:先裝好並啟用 Divi 父主題,子主題才能繼承它的功能。這部分流程跟 WordPress 主題安裝教學 一致。啟用子主題後,多數款會提供一鍵匯入 Demo 內容的選項,匯入後再換圖換字。
- 安裝並啟用 Divi 父主題。
- 後台「外觀 → 佈景主題 → 新增 → 上傳主題」,選子主題 zip 檔。
- 啟用子主題,執行一鍵匯入 Demo 內容。
- 換圖、換字、調 自訂字體 與配色。
- 確認手機版與平板版面沒跑版,必要時用 響應式網頁設計 RWD 觀念微調。
換子主題前,建議先備份。舊子主題的自訂 CSS 或頁面設定如果寫在子主題裡,刪除後會跟著消失。備份工具可參考 WordPress FTP 檔案管理,或直接用 WordPress 備份外掛做整站快照。修改樣式時,請把 CSS 寫進子主題,不要動 Divi 父主題檔案,日後更新才不會被覆蓋。
講到這裡,有人會問:那舊子主題的自訂 CSS 會不會跟新子主題打架?答案是會,只要兩者都啟用或 CSS 選擇器撞名就會衝突。所以換子主題時,舊的要停用乾淨,新套用的順序建議先匯入 Demo、再逐步搬移你舊的自訂 CSS,不要一次全倒進去。
一個常見的踩坑順序是:先在舊站啟用新子主題、匯入 Demo,結果 Demo 帶來的佈局跟你原本的頁面疊在一起,前台變成兩組頁首同時出現。比較安全的做法是在預備站(staging)或本機先套版,確認 Demo 匯入的位置、選單、頁首頁尾都正確,再推到正式站。正式站換裝前,務必做一次完整備份,並記下目前啟用的舊子主題名稱,出問題時才能快速切回。
套版後必做的檢查清單
很多人以為子主題套上去、Demo 匯入完就等於網站做好了,其實那只是起點。底下是一份套版後的檢查清單,逐項跑過才能確保站真的能上線、能接單、能在行動裝置上正常瀏覽。清單裡每一項都對應一個常見的套版失誤。
- 選單與頁首連結:Demo 帶來的選單常指向示篯頁,要逐一改成你真實的頁面 slug。
- 頁首頁尾全域統一:確認內頁、文章頁、商品頁的頁首頁尾一致,沒有某幾頁吃到舊版。
- 聯絡表單寄送測試:表單要實際寄一封測試信,確認收得到、不進垃圾郵件。
- 結帳流程全程測試:電商站要把商品加入購物車、走完結帳、確認訂單通知都有觸發。
- 行動裝置實機檢查:用真實手機開站,檢查欄位堆疊、字級、按鈕可點擊範圍。
- 圖片與字型授權:Demo 用的圖片多半是示意,商用前要換成有授權的素材。
- 社群分享與 SEO 中繼資料:標題、描述、社群分享圖要改成你自己的。
- 頁面載入速度:套版帶來的動畫、大圖要檢查是否拖慢首頁載入。
行動裝置的優先級別特別高。根據 Statista 統計,行動裝置(不含平板)占了第一季全球網站流量的 52.27%,超過半數訪客是從手機進來的 [來源:Statista〈Share of mobile web traffic worldwide quarterly 2015-2026〉 https://www.statista.com/statistics/277125/share-of-website-traffic-coming-from-mobile-devices/ 2026-04-28]。不只流量結構傾斜手機,Google 的索引行為也早就以手機版為準:自 2023 年 10 月 31 日起,Google 宣布行動優先索引全面完成,所有能在行動裝置運作的網站都會主要由行動爬蟲抓取 [來源:Google Search Central Blog〈Mobile-first indexing is here〉 https://developers.google.com/search/blog/2023/10/mobile-first-is-here 2023-10-31]。換句話說,你的手機版跑版,被搜尋引擎看到的、被收進索引的,就是那個跑版的版本。子主題的手機版斷點若沒調好,等於把過半流量推到跑版的頁面上,同時還把跑版的內容餵給 Google,這也是為什麼前面一直強調響應式要實機檢查。
七款子主題的二維決策矩陣
把七款子主題擺進二維座標,挑選會直觀很多。底下用「維護成本」當縱軸、「業務用途廣度」當橫軸,畫出一個示意定位。維護成本包含要砍多少頁、要改多少 CSS、要等多少更新;業務用途廣度指一款能不能撐起多種網站類型。
| 用途窄(單一場景) | 用途廣(多場景) | |
|---|---|---|
| 維護成本低 | Divi Business(免費、6 頁,裝完幾乎不用改) | Divi Ecommerce(頁面精簡,主打轉換,維護省) |
| 維護成本中 | Divi Resume(履歷專用,結構單純) | Molti(15 頁以上形象款,要挑模塊) |
| 維護成本高 | Divi eLearn(綁 LearnDash,課程元素要對接) | DiviCommerce、Avanti(頁面多,整理時間長) |
這個矩陣告訴你一件事:用途廣又維護低的款很少。Avanti 雖然用途最廣,但 40 頁的整理成本不低;Divi Business 維護最低,但用途被鎖在專業服務。多數站長最後會落在「用途窄+維護低」或「用途窄+維護中」這兩格,因為需求明確的站本來就不需要萬能款。先用矩陣框出你能接受的維護上限,再往那格裡挑對應的款,會比逐款比頁面數快。
把總持有成本算出來:子主題評分卡
定價只是入手成本,真正會吃掉你時間的是持有成本。底下提供一張評分卡,把一款子主題的總持有成本拆成五個維度,每個維度給 1 到 3 分,加總後分數越低代表長期越省。這套評分卡的目的,是讓你在採購階段就把隱形成本量化出來,避免只看定價就下手。
| 維度 | 3 分(成本高) | 2 分(成本中) | 1 分(成本低) |
|---|---|---|---|
| 補頁成本 | 缺結帳、商品頁等關鍵頁,要從零拉 | 缺部分次要頁,需手動補 1 到 3 頁 | 所有關鍵頁都預先做好 |
| 整理成本 | 40 頁以上,套用後要大量砍頁 | 15 到 25 頁,需挑選模塊 | 6 頁以內,裝完幾乎不用改 |
| CSS 改寫成本 | 外掛串接弱,結帳欄位要自己套版 | 部分頁面需微調選擇器 | 原生串接,幾乎不用改 CSS |
| 更新維護風險 | 來路不明、無更新日誌可查 | 付費但作者更新頻率一般 | Marketplace 付費款、有持續維護 |
| Divi 5 相容風險 | 未標示支援,撞架構差異要自己拆 | 標示相容但仍在收尾 | 明確支援 Divi 5 新架構 |
用這張評分卡回頭看七款:Divi Business 在整理成本與 CSS 改寫兩項最低,但補頁成本對電商需求高的人是 3 分;Divi Ecommerce 的外掛串接與 Divi 5 相容風險都低,補頁成本也低,是綜合分數最低的電商選項;Avanti 頁面覆蓋最廣但整理成本最高。把這五項的分數加起來,你會發現標價便宜的款,持有成本不見得低;標價高但五項都低分的款,長期反而省。決策時先把分數算出來,再跟定價一起看,會比單看價格籤誠實得多。
客製安全區:自訂 CSS 該寫在哪才不會被更新洗掉
更新後修改被洗掉是子主題使用者最常見的痛點,而問題的根源多半是自訂寫錯了位置。子主題的檔案結構裡,有些檔案每次更新會被覆蓋,有些則會保留,理解這個邊界才能讓你的客製跨更新存活。底下把常見的寫入位置分成安全區與危險區兩類。
- 安全區:Divi Theme Options 的自訂 CSS 欄。這個欄位儲存在資料庫,子主題更新時不會被覆蓋,是放全域客製 CSS 最穩的位置。
- 安全區:頁面層級的 Divi Builder 自訂 CSS。寫在單一頁面模組或該頁的 Custom CSS 區,跟著頁面存在,更新子主題不影響。
- 安全區:獨立的外掛或 code snippets。把功能邏輯裝在獨立外掛裡,與主題完全解耦,主題怎麼更新都不受影響。
- 危險區:子主題的 header.php、footer.php 等模板檔。子主題更新若重新打包這些檔案,你的修改就會被還原。
- 危險區:直接改父主題 Divi 的任何檔案。父主題一更新必定覆蓋,這是子主題之所以存在的根本原因。
判斷原則是一句話:會跟著資料庫或頁面存在的,屬於安全區;會跟著檔案被重新打包的,屬於危險區。需要動到模板檔的客製,正確做法是複製一份到子主題再改,並且在子主題更新時手動比對差異,把你的改動重新套回新版本。養成把自訂集中寫在安全區的習慣,更新時就不會反覆補救。這個原則不只適用於 Divi,也是所有 WordPress 子主題通用的工作方式。
什麼情況不該用 Divi 子主題
子主題不是萬靈丹。有些情境硬套子主題反而綁手綁腳,底下三種情況建議重新評估,甚至改走別的路線。誠實把這些情境講清楚,你才不會買了子主題卻用得痛苦。
- 高度客製的設計語言:你已經有完整的品牌規範(spec)、每個元件都有自訂規格,這時套子主題等於先覆蓋再改回去,不如直接用 Divi Builder 從版型庫逐頁拼,參考 Divi 佈局版型。
- 非 Divi 生態圈的站:你的站跑在 Astra、Elementor、Flatsome 上,Divi 子主題裝上去無法正常運作,請改用對應主題的子主題。
- 極簡單頁站:你只需要一頁式落地頁,套一整套 20 頁的子主題是殺雞用牛刀,直接用 一頁式網頁模板 更省事。
判斷原則很簡單:子主題的價值來自「整站結構預先做好」。如果你的站結構本來就很單純,或者你的設計規範已經嚴格到不容許任何預設版型,子主題的邊際效益就會很低。這時把預算挪去買版型庫或單頁模板,反而更貼合需求。
常見問題:免費 vs 付費、Divi 5 相容、能不能用在非 Divi 主題
Divi 子主題最常被問的三個疑問:免費子主題可以先試但商用建議升級付費款;Divi 5 升級後舊子主題不一定能直接用,購買前確認相容標示;Divi 子主題只能用在 Divi 主題之下,不能用於 Astra、Elementor 等其他主題。
免費與付費的差別,本質上是更新維護與支援。免費款適合學習與試風格,但作者不一定持續維護;付費款在 Marketplace 上販售,有評價與更新日誌可查,撞到 Divi 5 改版時作者通常會跟進。如果你打算長期商用,把更新維護成本算進去,付費款往往更划算。
- 免費 vs 付費:免費款試風格,付費款提供更多頁面、更新維護與官方支援。
- Divi 5 相容性:Divi 5 改寫底層,部分舊子主題需等作者更新,買前看 Elegant Themes 官方的 Divi 5 文件與各子主題的更新日誌。
- 跨主題限制:Divi 子主題綁定 Divi 主題,非 Divi 生態圈請改用對應主題的子主題。
- 終身會員:常買多款建議加入 Divi Marketplace 終身會員,單價攤下來更低,還能持續取得 Divi 5 相容更新。
跨主題這點要特別講清楚。Divi 子主題顧名思義只能用在 Divi 主題之下,Astra、Elementor、Astra Pro、Flatsome、Avada 這些都不是 Divi 生態圈,裝上去也不會正常運作。非 Divi 路線想找模板,可改看 Astra WooCommerce 設定、Betheme、ThemeForest 付費主題。
定價部分,各子主題採單一購買,終身會員可享折扣,實際金額會變動,以 Elegant Themes 官網為準。多數付費款屬,撰寫時不寫死具體數字。如果你常需要不同版型,Divi Cloud 跨站版型同步 也可一起評估,能把版型跨站重用。
套版後的速度與轉換:子主題不是終點
子主題把版面做好,不等於把業績做好。網頁載入速度直接影響轉換率,而子主題帶來的動畫、大圖、額外模塊正是常見的拖慢來源。Google 在 web.dev 公開的案例顯示,投入 Core Web Vitals 優化能實質拉高轉換:Rakuten 24 投入 Core Web Vitals 後,每位訪客營收提升 53.37%、轉換率提升 33.13%;Vodafone 把 LCP 改善 31%,銷售增加 8%;redBus 改善 INP 後銷售增加 7%;The Economic Times 通過 Core Web Vitals 門檻後,整體跳出率改善 43% [來源:web.dev(Google)〈Why does speed matter?〉 https://web.dev/articles/why-speed-matters 2026]。
把這些數字放回子主題的脈絡:套版後若發現首頁 LCP 偏高、INP 卡頓,多半是 Demo 帶來的全螢幕影片、視差背景或大量未壓縮圖片造成。調整方向是先量測再優化,用 PageSpeed Insights 或 Lighthouse 跑一次正式站,找出最拖慢的資源,逐一處理。動畫模塊能延遲載入的就延遲、圖片能轉 WebP 就轉、影片能換成輕量 hero 圖就換。
速度之外,轉換率工程也要接著做。子主題給你版型,但 CTA 的文案、位置、顏色、表單欄位數量這些變因,要靠你持續測試。把 CTA 行動呼籲按鈕設計、WooCommerce 結帳頁客製化 跟速度優化串起來,套版來的流量才有機會收成訂單。
疑難排解:套版常見的五個錯誤
底下整理套用子主題時最常遇到的五個錯誤,每個都附上判斷方式與處理方向。這些錯誤多半不是子主題本身的缺陷,而是套用流程或環境配置的問題。
- Demo 匯入失敗或卡住:通常是 PHP 記憶體上限太低或執行時間太短,調高 memory_limit 與 max_execution_time 後重試;若牽涉遠端圖片下載,也可能是主機對外連線被擋。
- 套用後版面全白或排版錯亂:先確認 Divi 父主題已啟用、且版本與子主題相容;再檢查是否有快取或外掛衝突,暫時停用其他外掛逐一排查。
- 手機版欄位順序亂掉:這是響應式斷點設定問題,到 Divi Builder 的行動裝置檢視調整欄位順序,必要時參考 Divi 手機版排序調整。
- 選單指向示篯頁或 404:Demo 帶來的選單項目指向示篯 slug,要到手動選單設定改成你真實頁面,或重建選單。
- 更新子主題後自訂被覆蓋:只要自訂 CSS 寫在子主題的 style.css 之外(例如 Divi 的 Theme Options 自訂 CSS 或子主題專屬自訂區),更新時多半會保留;寫在會被覆蓋的檔案裡就會被洗掉。
第五點尤其值得記住。子主題更新通常只動 Demo 內容與部分模板檔,你的自訂若放在獨立的安全區,就能跨更新存活。養成習慣:所有自訂集中管理,不要散落在會被覆蓋的範圍裡。
依網站類型對應到對的子主題
依網站類型對應:一般電商選 Divi Ecommerce、硬派品牌電商選 DiviCommerce、品牌形象選 Molti、形象+電商混合選 Avanti、零成本入門選 Divi Business、個人履歷選 Divi Resume、線上課程選 Divi eLearn。
| 網站類型 | 推薦子主題 | 理由 |
|---|---|---|
| 一般消費品電商 | Divi Ecommerce | 現代簡約,內建倒數計時與 A/B 測試,主打轉換 |
| 硬派、運動品牌電商 | DiviCommerce | 約 23 頁、6 首頁,版型替換彈性大 |
| 品牌形象、預約網站 | Molti | 15 頁以上,原生響應式,動畫完成度高 |
| 形象+電商混合 | Avanti | 40 頁以上、8 首頁,與 WooCommerce 完整串接 |
| 律師、醫療等專業服務 | Divi Business | 免費、6 頁、專業可靠,CP 值最高 |
| 個人履歷、作品集 | Divi Resume | 作品集+聯絡表單,突出聯絡資訊 |
| 線上課程平台 | Divi eLearn | 20 頁以上,串接 LearnDash,可禁用原生課程頁 |
電商類看品牌調性二選一:現代風選 Divi Ecommerce,硬派風選 DiviCommerce。專業服務類,免費的 Divi Business 即足夠,省下的預算可以拿去優化 WooCommerce 稅金設定、綠界金物流串接、訂單 LINE 推播 這些更影響營運的環節。
個人品牌兩條路:開課選 Divi eLearn,履歷選 Divi Resume,利基需求不必在多用途款裡妥協。如果你想順手把版面再升級,圖片懸停特效、視差滾動效果、商品輪播外掛、分類篩選外掛 都能疊上去。要擴充更多模塊,Divi Supreme 模塊 與 必裝的 Divi 外掛 值得一併看。
子主題套完不等於網站做完。把 作品集網站設計、價目表設計、一頁式品牌網站 這些細節補上,套用來的版型才有辦法把流量收成訂單。回顧整段邏輯:先確認三個判準都過,再依網站類型對應,最後才是細節優化,順序錯了會白花錢。
如果你想比較的是更廣的 WordPress 主題市場,可以延伸到 WordPress 佈景主題推薦清單、免費 WordPress 部落格主題、用 Divi 打造電商平台、Divi 部落格架站 與 WordPress 架站費用、WordPress 部落格架站。
挑選前你最想搞清楚的幾件事
Divi 子主題是什麼?跟 Divi 主題有什麼差別?
Divi 子主題是依附在 Divi 父主題之下的設計層,預先做好頁首頁尾、首頁、電商頁面等版型,一鍵套用整批頁面。差別在於子主題管整站結構與功能,而你的客製 CSS 寫在子主題裡,父主題更新時不會被覆蓋。
為什麼要用 Divi 子主題,不能直接改 Divi 主題嗎?
直接改父主題,檔案更新維護時你的修改會被還原。把改動寫進子主題,更新不會被洗掉,衝突時也比較好還原,這是用子主題最主要的原因。
Divi 子主題可以免費用嗎?免費跟付費差在哪?
可以,像 Divi Business 就是免費款。免費款適合試風格與學習,付費款則提供更多頁面、持續的更新維護與官方支援,商用長期建議升級付費款。
Divi Ecommerce 適合哪種電商網站?
適合追求轉換率的一般消費品與數位商品電商。它走現代簡約風,內建倒數計時器、電子報表單與 A/B 測試 CTA,原生覆蓋 WooCommerce 購物車、結帳、我的帳號頁面。
哪一款 Divi 子主題支援 LearnDash 線上課程?
Divi eLearn。它專門串接 LearnDash,有 20 頁以上模板與課程元素區塊,最大特色是能禁用 LearnDash 原生課程頁,把課程內容與購買按鈕放到任意頁面。
Divi 子主題更新後我的修改會不會被覆蓋?
只要把 CSS 與功能改動寫進子主題、不要動父主題檔案,Divi 主題更新時不會覆蓋你的修改。子主題本身的更新一般只動 Demo 內容,你的自訂也不會被洗掉。
Divi 子主題可以套用在非 Divi 主題上嗎?
不行。Divi 子主題綁定 Divi 父主題,用在 Astra、Elementor、Flatsome、Avada 等非 Divi 主題上無法正常運作,請改用對應主題的子主題或模板。
Divi Marketplace 終身會員跟單一購買哪個划算?
只買一款就單一購買即可;若會買多款子主題或外掛,終身會員攤下來單價更低,還能持續取得 Divi 5 相容性更新。實際定價以官網為準。
Divi 5 升級後舊子主題還能用嗎?
不一定。Divi 5 改寫底層架構,部分舊子主題需等作者更新才能正常運作,購買前看商品頁與更新日誌是否標示支援 Divi 5。
七款子主題裡哪一款頁面數最多?
Avanti,40 頁以上、8 種首頁,並與 WooCommerce 完整串接。頁面數多代表整理成本也高,套用後要花時間砍掉用不到的版型,挑選時把整理時間一併算進去。
套用子主題後首頁載入變慢怎麼辦?
先量測再優化。用 PageSpeed Insights 或 Lighthouse 找出拖慢的資源,常見是 Demo 帶來的大圖、視差背景或全螢幕影片。圖片轉 WebP、動畫延遲載入、影片換成輕量 hero 圖,都是可著手的調整方向。
同時需要形象頁和電商頁,該挑哪一款?
挑 Avanti。它有 40 頁以上、8 種首頁,並與 WooCommerce 完整串接,能一次包辦品牌形象與商品販售。若品牌調性偏現代簡約且商品少,也可以用 Divi Ecommerce 再手動補幾頁形象頁。