這篇整理了多款優質的「 WooCommerce佈景主題 」。
WooCommerce 是知名的網路開店平台,也是 WordPress 中強大的電商外掛,只要安裝啟用後,就能讓網站搖身一變成強大的購物網站。更多 WooCommerce 完整教學。
除了電商基本的購物流程、訂單管理、會員管理等 .. 核心功能,搭配客製化功能高的電商主題,是非常重要的。更多 電商優質外掛推薦。
因為強大的電商主題,除了能讓站長打造獨特的品牌樣貌,也可讓訪客對網站印象更深刻:)
如果你也想成為電商主,也可參考 購物車架設(Flatsome 主題)、電商架設(Astra 主題),都是從 0 到 1 的完整網站製作。
好囉,文章內會推薦多款優質 WooCommerce 電商主題(高質感+功能性強),相信應該會對你有所幫助。章節如下:
至於如何安裝第三方主題,可參考 WordPress 主題安裝。準備好了嗎?我們開始吧:)
- 1. Astra
- 2. Flatsome
- 3. Divi
- 4. OceanWP
- 5. Porto
- 6. Shopkeeper
- 7. WoodMart
- 8. Xstore
- 9. Electro
- 10. The Retailer
- 常見問題
- WordPress 學習資源
WooCommerce 佈景主題推薦,影片分享
1. Astra
Astra 是 Brainstorm Force 開發的主題,你無需會任何編碼,就可完美的 WordPress 網站製作,有免費版&進階版可使用。更多 Astra 主題教學。
它是多功能的 WordPress 主題,不論是 Blog 建立、企業形象網站、電商購物網站、線上課程網站、預約網站 等 .. ,或是其他常見類型, Astra Theme 幾乎都能幫助你完成。
Astra Theme 內建多種主題樣板
Astra 有提供 Starter Templates 外掛,裡面有 70 多種樣板風格,一鍵安裝就能快速架站,非常的方便。免費版也有 30 多種可使用。
Astra 會如此流行的原因,其中一點是它對主流的 WordPress 視覺化編輯器,有著完美的兼容。
像是 Elementor、Beaver Builder、Gutenberg 等 .. ,可用這些頁面編輯器搭配 Astra 主題,完整製作個人或公司品牌網站。更多 Elementor 教學。
Astra 主題速度評測
有關於主題速度表現,輕量的佈景主題、禁用 Jquery、優質的程式編碼,都是 Astra 速度優於其他主題原因。
這讓 Astra 在多個速度評測軟體上,都獲得了優異的表現。
Astra 多種佈局調整功能
Astra 有多種自定義選項,可充分設定網頁佈局,讓你的網站更像是客製化的效果。
有提供網站頁首 / 頁尾修改、主視覺顏色調整、字體字型調整、選單佈局調整、各頁面版面配置等 ..,輕量但精悍。
這意味著,你可以做大方向的調整,把網站設計成喜愛的樣子。
Astra 也支援電腦、平板、手機的即時預覽模式,加上有視覺化編輯效果,編輯起來更快速。
簡單來說,Astra 是多功能輕量級主題,支援主流頁面編輯器,絕對是值得使用的一款優質主題!
2. Flatsome
Flatsome 是最暢銷的 WooCommerce 購物網站和商業主題,它在 ThemeForest 主題森林的電子商務分類上,蟬聯 No.1 許久。更多 Flatsome 完整教學。
如果你正打算架設購物網站,可參考下面影片將會帶你從 0 到 1,直接晉升成專業電商主。
Flatsome 的主要功能都是為網路開店打造,有多種不同的線上商店、企業形象版型,只需一鍵安裝即可套用。
不論是服飾、運動用品、倒數特賣、服務購買 .. ,讓你自由挑選。
UX Builder 它是 Flatsome 的專業頁面編輯器,你無需任何編碼經驗,就可以用拖曳方式,打造出精美的網路開店平台。
它有多種的頁面佈局方式,讓你品牌網站獨一無二。
Flatsome 還有多功能區塊元素,可讓你的網頁設計天馬行空,出色的組合建置網站。
同步支援手機頁面呈現、優質的主題速度、SEO優化 .. ,這是很正常的事。
Flatsome 是打造完美的線上開店平台的最佳幫手,如果想經營電商平台,絕不能錯過它。
3. Divi
Divi 是由知名 Elegant Themes 公司開發,是許多網頁設計師喜愛的一款軟體,除了功能強大且有很多高質感的元素(和現成模板)。更多完整 Divi 中文教學。
不需要任何程式概念,用拖曳方式就能設計漂亮的網站,就像官網所描述的,視覺化設計和佈局排版都將變得更加容易。
使用 Divi 主題,完整架站教學(全攻略分享)
Elegant Themes 旗下產品,有全功能 Divi Theme 佈景主題、Divi Builder 頁面編輯器、Extra 主題(可用在部落格 / 新聞雜誌 / 作品集 ..)、Bloom 電子報註冊行銷工具、Monarch 社群工具等 ..。
所以使用 Divi 軟體,不會只有一種軟體可用,而是能享受它們公司的所有服務,非常的划算。
加上多種區塊模板和完整的網站樣板,有商業風、線上開店平台、科技風、服務類型等 .. 多種主題風格。
你只需幾點擊按鈕,即可引用區塊樣板,或套用整個網站設計。
Divi 對 Woocommerce 開店平台外掛有完美的支持,並提供多種線上開店的區塊功能,一樣用拖放方式即可放入頁面。
使用 Divi 會是個很棒的選擇,因為它能幫你做到很多事。
方案評論
Divi 的使用方案很簡單,它提供基本的「 Divi 」方案和更多功能的「 Divi Pro 」方案,兩者都有「 年租方案 」和「 終身方案(一次性)」。
每種方案都能應用在無限數量的網站,費用也維持在合理範圍,犬哥建議可以選擇「 Divi 」終身方案。
有個好處是,Divi 整體系列包含自開發的多功能 WordPress 佈景主題,且和旗下產品有完美兼容,這代表你可能不需再額外購買 WordPress 主題。
特別一提,終身使用方案在 WordPress 頁面編輯器市場中,是比較棒的收費方式。
這代表你只需負擔一次性的小額費用(和外包網頁設計相比),就能終身享用所有 Divi 功能。
產品定價
Divi 的年租用方案,原定價是 $89 美元 / 年(約 $2,700 台幣 / 年),可應用在無限數量的網站。
Divi 的終身方案,原定價是 $249 美元(約 $7,500 台幣 / 終身),一次性費用即可終身使用,可應用在無限制數量的網站。
但有個好消息要告訴大家,請看下面享有全方案的折扣優惠!
★☆ — 重要資訊 — ☆★
犬哥網站與 Divi 有長期合作關係,點擊此連結 Divi 10% 折扣,將可享用任一方案 10% 的限時折扣優惠,請一定要把握唷:)
終身方案是一次性費用,購買之後隔年不會有額外費用,你可享有 Divi 軟體終身更新+優先的客戶服務(建議優先選擇,比較划算)。
4. OceanWP
OceanWP 是一款適合入門的 WordPress 優質主題,可進行多種類型的網站架設,不論是部落格、品牌官網、購物網站設計等 .. ,是輕量的綜合型主題。
多種設計風格的內建套版,只需一鍵安裝,不用會任何程式碼,也能自架網站。
它同步支援 WooCommerce 外掛,可快速打造自己的電商平台,不費吹灰之力。
漂亮的 RWD 手機版頁面,滿意的網站速度表現,內置 SEO 關鍵字優化基礎,都是新手、老手愛使用的原因。
OceanWP 免費版就有提供許多可設定的功能,並和線上主流頁面編輯器 Elementor 完美結合,可讓你自由的設計網頁佈局。
如果你想進一步客製化網站頁面,OceanWP 也有進階版方案,能夠滿足你的需求。
看起來很棒吧,如果你喜歡 OceanWP 的設計風格,那它可能是你快速架站的好夥伴:)
5. Porto
Porto 是新網站&網路開店主題的好選擇,可用它來完成形象網站架設,或是建置線上購物網站。
「 WooCommerce佈景主題 」相關分類,一直是個競爭的市場。
而 Porto 主題的銷售數量僅次於 Flatsome(Themeforest主題森林 排名),是許多人愛好的選擇。
Porto 提供多種選項,可設定主視覺顏色、佈局排版、頁首頁尾調整、選單設計等 ..,如下圖。
Porto 會如此熱門的原因之一,因為它有和多數主流頁面編輯器兼容,像是 Elementor、WPBakery、Gutenberg,讓網頁客製化能力達到更大的層度。
Porto 是真正的多用途主題,像是作品集、開店平台、一頁式網頁、商業形象等 .. ,有高達 100 多種風格可直接套用,再修改成自己喜愛的樣子。
以上就是 Porto 主題簡單介紹,如果對它有興趣或喜愛,可點下面連結前往。
6. Shopkeeper
如果你想發展線上生意,使用 WooCommerce 是明確選擇,再來就是挑選一個優質主題。
Shopkeeper 是為 WooCommerce 量身打造的佈景主題,它的版型設計和視覺風格,是我用過多種主題,算是滿喜歡的一款。
它有多種全站的整體版型,也針對每種類型頁面,像是商品列表頁、購物車頁面、產品頁面、結帳頁面等 .. ,都有不同的呈列版型。
多種美觀的商品列表頁,可從中選擇一款適合自己商店的,簡單挑選其中一款分享,如下圖。
有關單一商品版型,Shopkeeper 種類也十分豐富,多數是乾淨簡約的版型,很適合年輕風格。
它還提供多種購物車版型,可依照喜愛的推薦做調整。
Shopkeeper 主題,有搭配 Visual Composer 頁面編輯器,可使用它進行視覺化網頁設計+調整,不需會任何程式技巧,動動小手就能製作頁面。
還可透過 Slider Revolution 輪播圖外掛,設計網站輪播圖或是商品介紹封面。
以上就是 Shopkeeper 主題簡單介紹,如果對它有興趣或喜愛,可點下面連結前往。
7. WoodMart
WoodMart 是專為 WooCommerce 量身打造的佈景主題,主要提供給線上開店者使用,在銷售成績也有很好的表現。
優異的 AJax 整合技術,為顧客提供高速、不間斷的購物車流程,不用不斷的刷新頁面影響使用者體驗,這是它的重要特色。
有多款現成模板,只需一鍵安裝即可套用,且對移動端手機支援良好,切換至手機版操作,幾乎沒有不順暢的地方,所以有許多的推薦者。
有多種頁首頁尾佈局、商品列表、單一商品、購物車版型等 .. 可自由搭配,無需任何的技術背景,在後台動手切換就可以。
至於頁面編輯器部分(視覺化編輯),WoodMart 把 WPBakery 整合到自己主題中,在 WoodMart 就能拖放設計頁面。
下圖是 WPBakery 示範影片,在 WoodMart 主題使用也差不多這樣。
除此之外,WoodMart 對主流 WordPress 外掛有良好整合,像是 Elementor(頁面編輯器)、Yoast(SEO優化)、MailChimp(電子報)、Revolution Slider(輪播圖設計)等 ..,增強了它的知名度。
以上就是 WoodMart 主題簡單介紹,如果對它有興趣或喜愛,可點下面連結前往。
8. Xstore
Xstore 是優質的 WooCommerce 主題,它和 Elementor、WPBakery 頁面編輯器完全兼容,可以用視覺化編輯方式,設計出美觀的網頁。
豐富的可套用樣板,可以找尋最適合自己商店的主題風格,有餐廳、咖啡館、時尚服飾、嬰兒用品、電子設備等 .. 應有盡有。
Xstore 有明確聲明 6 個原因,推薦你可以完全信任它們,完全視覺化頁面編輯、優良的主題速度、整合多種有價值外掛、主題保持最新版、專業的客戶服務、超過 8 年的主題歷史。
確實,當挑選 WooCommerce 主題時,這些原因都能讓顧客更放心。
豐富多功能的購物相關功能,和可自由調整的版面設計,它會是購物網站主題的好選擇。
以上就是 Xstore 主題簡單介紹,如果對它有興趣或喜愛,可點下面連結前往。
9. Electro
Electro 是新一代簡潔、體驗友好、響應快速的「 WooCommerce佈景主題 」,可高度自訂網站面&網站功能,是專為 WooCommerce 網路商店所設計。
可以從多種現成模板進行選擇,能輕鬆的改變所有顏色、重新排列網頁佈局、增加新的區塊功能等 ..。
有多種可自由調整的頁首樣式,讓你更改顏色、透明度、選單位置、高度等 .. ,可客製化網站頁首 Header。
包括商品頁面、購物車頁面、結帳流程、會員頁面等 .. ,你也能自行設計修改品牌風格。
Electro 與多種頁面編輯器有完美兼容,像是 Elementor、Visual Comsposer,讓你不需會任何程式碼,就能跟專家一樣客製化網頁設計。
除此之外,Electro 還有許多優點,像是整合了多款高級外掛、對 SEO 優化良好、支援多國語言等 .. ,都是許多喜愛的原因。
以上就是 Electro 主題簡單介紹,如果對它有興趣或喜愛,可點下面連結前往。
10. The Retailer
The Retailer 是值得信任的 WooCommerce 主題,它提供完整的購物網站解決方案,有專業團隊持續更新、友善的客戶支持。
有多種美觀的內建樣板可直接引入套用,不需要從零開始設計網頁,幫助網站主節省時間。
購物網站販售的商品有百百種,The Retailer 有針對不同產品類型,給予不同的版型編排,像是簡單商品、可變化商品、群組商品、外部 / 會員商品、可下載商品等 ..
不論是網站頁首頁尾、商品頁面、購物車頁面等 .. 相關的頁面修改+視覺調整,使用 The Retailer 會非常容易。
The Retailer 對主流的頁面編輯器,也有完整的兼容支持,像是 Elementor、WPBakery、Gutenberg .. ,讓你可用視覺化設計網頁,而不需要會任何程式碼。
除此之外,The Retailer 還有許多優點,讓你幾乎能使用它賣任何商品。
以上就是 The Retailer 主題簡單介紹,如果對它有興趣或喜愛,可點下面連結前往。
常見問題
WordPress 電商主題和一般主題,兩者有差別嗎?
通常每種 WordPress 主題,都有各自想強調的特色。
像有些主題是專為部落格打造的、有些則是多功能主題,可運用在不同類型的網站、有些是專門給電商使用的 ..。
站長能針對自身需求,套用適合自己網站需求的主題,才會發揮最大效益。
以 Flatsome 電商主題為舉例,它有內建 UX Builder 頁面編輯器,裡面有豐富的電商元素,可客製化商品列表頁、單一商品頁,或是最重要的商店首頁等 ..。
在第三方平台購買的 WordPress 主題,要如何安裝呢?
可前往 WordPress 外觀 > 佈景主題 > 安裝佈景主題,進入後點擊「 上傳佈景主題 」,並把購買的主題檔案上傳(通常是 zip 壓縮檔)。
然後安裝+啟用主題,就可以套用囉:)
具體可以參考: 在 Envato ThemeForest 購買主題 / 外掛教學。
WordPress 學習資源
學習網站架設+網路行銷的過程中,或許會遇到一些解決不了問題,可以在下方留言給我,我會盡力協助解答!
接下來,額外分享 3 項實用資源,可有效幫助大家做學習。
資源一:WP 高手架站課(線上課程)
這門 WordPress 高手架站課 濃縮了犬哥多年在網頁設計的實戰經驗,從網頁設計觀念、WordPress / WooCommerce 後台操作、熱門主題.外掛教學、品牌網站 / 部落格 / 電商網站,3 大類型網站建置方法等 .. 豐富內容,一次教會你。
課程內容非常的紮實(長度超過 20 小時)。如果你剛學習自架網站,這門課程可以讓你用最快的速度,就學會這項技能!
點擊下面了解課程,立馬擁有自己的品牌網站,並增加網路曝光度!
資源二:SEO 排名飆升課(線上課程)
網站建立完畢後,但卻沒有流量怎麼辦?或是只能靠花錢投廣告才會有訂單?
這門 SEO 排名飆升課,教你掌握關鍵字策略、SEO 文章撰寫、多種實戰 SEO 技巧、透視對手 SEO 策略、SEO 必備軟體教學、最新 AI SEO 應用等 ..,大幅提升行銷能力。
點擊下面了解課程,帶你衝上 Google 排名第一頁,大量提升網站營收和訂單!
資源三:犬哥數位(專業 WordPress 網頁設計公司)
如果你沒時間自己架站、或是遇到解決不了的網站問題。歡迎洽詢 犬哥數位(WordPress 網頁設計公司),請專家製作會更有效率!
資源四:更多犬哥教學資源
如果你在操作過程中遇到問題,可以加入 犬哥研討社(目前有超過 9000+ 團員)。除了有網友一同幫你解惑外,犬哥團隊也會同步在社團幫助大家。
如果你想學更多網頁設計、數位行銷知識,可關注 YouTube 頻道,或是歡迎追蹤 犬哥網站 IG。