Whoops

Divi 主題架站全攻略:從零打造公司官網

Divi 主題架站完整教學:從網域、主機、SSL、WordPress 安裝到 Divi 視覺編輯器,零程式基礎也能打造專業公司官網,涵蓋響應式設計、SEO 與上線後維護一次搞懂。

作者:褚崇名(Sliven)

本頁目錄

用 Divi 架公司官網,值不值得投入

想像你剛接下一間公司的數位門面任務:老闆要一個「看起來像樣、能接單、又要我們自己改得動」的官網,預算沒有到外包給設計公司的門檻,卻又不能用那種一眼就被看穿的免費模板。你想了一輪,把腦筋動到 Divi 身上。接下來要談的,就是這件事到底該怎麼做,做錯會踩到哪些地雷。

先給你結論:Divi 較適合公司裡有人願意接手維護、網站不需要大量客製後台邏輯,而且品牌視覺希望自行掌控的情境。實際時程取決於內容、素材、審核流程與製作者熟練度;若需求包含複雜會員權限、報名流程或報表後台,Divi 只能處理前端呈現,仍要另行規劃系統功能。

整套流程可拆成「開工前決策、資訊架構、安裝與全域設定、六大頁面實作、手機版、上線前檢查、上線後維運」幾段,每段都給你具體可執行的判斷點。如果你要的是 Divi 功能的百科全書,這篇 Divi 主題終極指南會更對味;這裡談的是「用 Divi 把一個公司官網從零蓋到上線」的專案節奏。

核心重點:六十秒看完重點

  • 先決策,再動手。主機、網域、Divi 授權、品牌素材、資訊架構這五件事沒定下來就開工,後面一定翻工。
  • 公司官網不需要太多頁。六個核心頁面夠你打天下,多出來的頁面大多是把預算燒在沒人會看的地方。
  • 全域設定是真正的時間黑洞。顏色、字體、按鈕樣式一次定好,之後每個頁面都在享受複利;省略這步,等於每個頁面從零開始。
  • 手機版不是把桌機版縮小。閱讀動線要重新設計,這是公司官網最容易掉單的地方。
  • 上線那天不是終點,是起點。備份、SEO、速度、表單測試沒做,上線第一天就在倒數下一次出事。

什麼時候該用 Divi,什麼時候該考慮別用

說穿了,Divi 的核心賣點就一句話:讓不會寫程式的人,也能用拖曳把腦中的版面排出來。對絕大多數中小型公司官網,這個賣點值回票價。它在 Elegant Themes 生態系裡累積了近二十年的版型、模組與教學資源,遇到問題多半找得到答案,這對沒有專職工程師的公司來說是隱形的保險。

但這裡不只講好話。實際評估一個公司官網要不要用 Divi 時會看的判準整理成這張表,幫你快速自我診斷。

情境 用 Divi 的合適度 建議
形象官網、服務介紹、作品集、部落格 非常合適 可用版型庫加快排版,但仍要重做品牌、內容與行動動線
需要會員登入、角色權限、客製報表後台 不那麼合適 Divi 管前台不管後台邏輯,這類需求得單獨寫程式或接外掛
單純賣東西的購物車網站 合適但要搭配 Divi 與 WooCommerce 可整合,不過複雜的結帳流程還是交給 WooCommerce 原生機制
視覺風格高度實驗、非典型版面 看你耐心 Divi 做得出來,但要花較多時間調,設計師可能更想直接寫 code
公司內沒有人願意接手維護 不合適 再好的工具沒人接手都是一次性專案,寧可外包或用代管服務

Divi 5 已結束 Beta 並持續更新(最新進度見 Elegant Themes 的 Divi 5.7 版本資訊,2026 年 6 月),但既有 Divi 4 網站升級前仍要在測試環境檢查版型、外掛與自訂程式的相容性。介面與遷移差異可參考 Divi 5 指南

如果公司官網未來要加入電商功能,也可評估 Divi 與 WooCommerce 的整合。WooCommerce 是廣泛使用的 WordPress 電商方案(W3Techs 市占統計,2026 年 6 月)。Divi 主要處理商品與分類頁的呈現;購物車、金流、稅務與訂單則由電商系統及相關服務處理。

自己架、找朋友架、還是委外?這個決策先做掉

在正式開工前,還有一個比技術更前面的問題:這個網站到底要由誰來做。很多公司直接跳進工具選擇,卻沒想清楚執行模式,結果做到一半才發現內部沒人、外包溝通成本爆表,或朋友做到一半人間蒸發。這個決策可分成三條路,各有各自適合的情境。

第一條路是公司內部自己架,也是接下來整套流程預設的執行模式。前提是有一位願意學習且具基本電腦操作能力的同事負責。優點是日後修改彈性高,內容與設定掌握在公司手裡;成本則不能只算授權,還要納入學習、製作與維護工時。

第二條路是找接案者或設計工作室委外。優點是成品品質較有保障、時程可控、你不用自己學技術;缺點是前期費用較高,而且後續每次修改都可能要回頭找原設計師,主動權不在公司手上。這條路適合預算充裕、或公司內部真的擠不出人力的情境。委外的眉角很多,你可以先把選擇網頁設計公司的判準讀一遍,避免踩到報價不透明、用版型交差卻當客製收費的坑。

第三條路是混合模式:委外完成設計系統與核心版型,上線後由內部維護內容。前提是合約要寫清楚交付工具、帳號與授權歸屬、操作文件、教育訓練及保固範圍,確保內部真的能接手。

不管選哪一條,建議先看過一份完整的架站方法比較與成本結構,把預算與時程框出來再決定。架站這件事最大的風險從來不是技術做不出來,而是做到一半才發現自己選錯了執行模式,前面投入的全變沉沒成本。

開工前先決定這五件事,否則一定翻工

在安裝 WordPress 與 Divi 前,先把以下五件事拍板。任何一項沒想清楚,都可能造成後續重工。

第一件:主機要放在哪

公司官網要依預估流量、功能、維運能力與預算選主機,不能只用方案名稱判斷。重點包括穩定度、備份與還原機制、支援的 PHP/WordPress 環境、目標受眾的連線延遲,以及客服品質。可先讀 主機類型比較,再用實際需求挑選。

第二件:網域用什麼

網域是公司的數位身分證,盡可能用公司品牌名加上 .com 或 .tw。挑網域時要注意商標問題、好不好念、好不好打。買好之後接著就是把 DNS 設定搞懂,這部分新手最容易卡關,建議直接參考DNS 網域設定的步驟做完,別用「憑感覺亂填」的方式帶過。

第三件:Divi 授權要買哪種

Elegant Themes 提供年繳與終身授權,Divi 本體目前都可用於不限數量網站;Divi AI、Cloud 等 Pro 服務則可能另按年計費。終身版是否划算要用當下價格、預計使用年限與所需服務計算,購買前以 Elegant Themes 官方方案頁 為準。

第四件:品牌素材到位了沒

這是最常被低估、卻最容易拖垮時程的一項。在動工前,你要先備齊:logo(含橫式與正方形版本)、品牌色票(RGB 與 HEX)、字體(中英文都要)、至少十到二十張可用的高解析度照片或圖示。沒有這些素材就開始排版,等於一邊蓋房子一邊找磚頭,每一頁都在等圖。

第五件:誰來接手維護

這不是技術問題,而是管理問題。開工前要確定網站上線後由誰負責改文字、換圖、發文章與處理更新,並讓接手人參與建置與驗收。若沒有明確負責人,內容與安全更新很容易停擺。

公司官網該有哪些頁面?一張資訊架構圖幫你砍掉六成不必要內容

資訊架構(Information Architecture,簡稱 IA)聽起來很學術,其實就一件事:這個網站要放哪些頁面、每個頁面之間怎麼連。太多公司官網敗在這一步,問題通常出在頁面太多,多到連自己員工都找不到資訊。

一個標準的公司官網,核心頁面其實就六個。下面把這六個頁面的角色、目標讀者、與常見犯錯整理出來。

頁面 主要任務 最容易犯的錯
首頁 三秒內讓訪客知道你是誰、做什麼、為什麼該選你 塞滿自我介紹,忘記回答訪客心裡的「這跟我有什麼關係」
關於我們 建立信任,放團隊、沿革、價值觀、實績 寫成落落長的企業沿革流水帳,沒有人想看
服務項目 清楚列出你提供什麼、怎麼收費、流程是什麼 把所有服務塞在同一頁,訪客找不到自己需要的那一項
案例或作品集 用過去的成果證明你能做到承諾 只放照片不放背景說明,訪客無法判斷這個案例跟他是否相關
部落格或知識庫 累積主題權威,帶來長期自然搜尋流量 開了欄位卻半年不更新,反而讓人覺得公司沒在動
聯絡我們 把有興趣的訪客轉成實際詢問 只放一個 email,沒有表單、沒有地圖、沒有明確下一步

這六個頁面之外,要不要再加?基本原則是:如果一個頁面無法對應到一個明確的讀者疑問,就先不要做。「公司沿革」可以併進關於我們、「人才招募」可以做但放在 footer 次要連結、「常見問答」可以先用部落格文章代替。先求上線,再依據真實訪客數據決定要不要擴充,這比一開始就蓋一個沒人維護的大網站務實得多。

這裡還有一個判斷技巧:把每個頁面想像成一個「業務員的抽屜」。如果這個抽屜打開,業務員找不到可以拿給客戶看的東西,那這個頁面就還沒到該上線的時候。先用這個標準把空抽屜砍掉,你的官網會精實很多。

從空白 WordPress 到可編輯的 Divi 站:安裝與全域設定實戰

決策做完、素材到位,接下來才是動手裝。這一段不逐格截圖教你點哪個按鈕(那種教學網路上很多),而是把流程中真正會卡住人的決策點挑出來講。

把 WordPress 先裝好再裝 Divi

Divi 是 WordPress 的主題,所以你必須先有一個能跑的 WordPress 環境。多數正規主機商都提供一鍵安裝,把WordPress 安裝流程跑完,確認後台能登入、固定連結設定正確,再進入下一步。固定連結這一步千萬別跳過,它直接影響你的網址結構與日後 SEO,相關設定可以一併參考 WordPress 固定連結 SEO 設定的觀念。

安裝 Divi 主題與啟用授權

從 Elegant Themes 會員區下載 divi.zip,在 WordPress 後台的「外觀 → 主題 → 安裝主題」上傳並啟用。啟用後輸入授權金鑰,這一步很重要,沒有合法授權就拿不到更新與資安修補。啟用後你會看到 Divi 在後台多出一整排選單,這時候先別急著開 Visual Builder 排版。

全域設定才是 Divi 真正的生產力關鍵

不要一裝好主題就逐頁調樣式。應先在 Visual Builder 建立全域變數與預設樣式,再用 Theme Builder 管理頁首、頁尾及內容範本。哪些內容會同步更新,取決於是否使用 Global Presets、Variables 或全域範本;一般複製的區塊不會自動同步。

全域設定要定的項目列成下面這張清單:

  • 品牌色票:主色、輔色、底色、文字色、成功與警告色,每個都要有明確 HEX 值。
  • 字體組合:標題字體與正文字體各一,中文建議用系統相容性高的 webfont,別用冷門字體拖累速度。如果你公司有指定字體,先參考 Divi 自訂字體上傳的做法處理。
  • 按鈕樣式:主按鈕、次按鈕、文字連結的圓角、底色、hover 效果,全部統一。
  • 頁首與頁尾:用 Theme Builder 做一個全站通用的 header 與 footer,包含選單、logo、聯絡資訊、社群連結。
  • 間距與容器:預設的 section 與 row 內外距,定一個全站統一的節奏,視覺才不會亂。

這張清單跑完,後續頁面就能沿用一致的設計規則。大部分常見樣式可用圖形介面處理,但特殊版面、無障礙或第三方整合仍可能需要 CSS 或程式調整。

用 Theme Builder 把頁首頁尾做成全站共用資產

全域設定裡有一塊特別值得獨立講,就是 Theme Builder。它能讓你把頁首、頁尾、文章範本、搜尋結果頁做成全站共用的版型,只要改一次,全站每一頁都同步。對公司官網來說,這代表 logo、主選單、聯絡電話、社群連結、footer 的公司資訊,全部集中管理,日後改電話或加一個社群帳號,不用逐頁去改。

實務上排 Theme Builder 的習慣是:先做 footer 再做 header。原因是 footer 的結構單純(公司資訊、聯絡方式、次選單、版權聲明),先做它可以讓你熟悉 Theme Builder 的操作邏輯;header 牽涉到選單、logo、可能還有手機版的漢堡選單與黏著效果,複雜度較高,留到熟悉之後再做會更順。header 做不好會直接拉低整個網站的專業感,如果你想用現成版型打底,Divi 的頁首套版資源可以給你一個好起點,再依品牌微調,會比自己從零拉快很多。

用 Divi Visual Builder 把六大核心頁面排起來

全域設定做好,接下來就是幾個關鍵頁面的實作。這裡不逐頁教你長相,因為每家公司的內容不同;重點是每個頁面在 Divi 裡的排版優先順序,以及要避開的常見坑

首頁:用一條動線把訪客帶到行動

首頁是公司官網的重要入口,但不一定是轉換率最高的頁面。常見順序是:英雄區(一句話價值主張+主按鈕)→ 服務或產品亮點 → 信任資訊(經授權的客戶標誌或案例摘要)→ 相關內容 → 行動呼籲。實際順序要依主要受眾、流量入口與任務調整。

英雄區的主按鈕,到底要連到哪裡?這個問題的答案,直接決定你的官網能不能帶來詢問。建議你讀過CTA 設計指南提升網站詢問的觀念再下手,別憑直覺放一個「了解更多」就交差。

服務頁:一項服務一個專屬頁面

如果你的公司提供多項服務,建議每一項主要服務都獨立一個頁面,服務總覽頁只放摘要與連結。原因有二:一是訪客想找的是「他需要的那一項」,不是「你會的全部」;二是獨立頁面才有辦法對個別服務做 SEO,把每一項服務都當成一個能被搜尋到的入口。

案例頁:給背景,不給空話

案例或作品集頁面不能只剩圖片。可交代專案背景、問題、做法與可驗證成果;客戶名稱、標誌、資料與引言都要先取得授權。若受保密條款限制,就改用匿名且不含可識別細節的描述。

聯絡頁:別只放一個 email

聯絡頁要提供符合實際營運方式的入口,例如聯絡表單、電話、電子郵件、營業時間與可履行的回覆時間。只有確實接待來客的地點才需要顯示地址或地圖。表單與地圖做法可參考 WordPress 表單外掛嵌入 Google 地圖

價目表或報價區:看你的商業模式決定要不要公開

要不要把價格寫在網站上,是很多公司的兩難。判斷原則是:如果你的服務有明確規格與公定價(例如課程、套餐、訂閱),公開價格能篩掉大量不對口的詢問;如果你的服務高度客製、每個案子報價不同,那與其放一個虛假的「起價」,不如放一個清楚的「服務流程+聯絡入口」。要用版型呈現價目資訊,Divi 的價目表模組夠用,相關技巧在價目表設計教學裡有詳細步驟。

Divi 版型庫的正確打開方式:套版但不看起來像套版

Divi 版型庫提供大量現成頁面與網站套件,但數量會持續調整。整套直接套用容易失去品牌辨識度;版型適合用來節省結構與排版時間,不能取代內容與設計判斷。

建議的做法是「拆解再重組」:不要整套套用,而是從不同版型裡挑你需要的區塊。例如首頁的英雄區用 A 版型、服務區用 B 版型、信任建立區用 C 版型,再統一套用你前面定好的全域色彩與字體。這樣既省下排版時間,又能讓成品有自己的樣子。想在其他專案重複使用這些組合,可以把拆解後的區塊存上雲端,日後直接取用。Divi 的高質感版型庫很適合當作這種拆解的素材來源。想先用免費資源的話,免費版型與子主題的來源也有整理可以參考。想先掌握各產業的版面慣例,可以參考Divi 版型原型與產業對照,把幾種常見行業的配置邏輯當作挑選區塊時的底稿。

這裡有兩個判斷點可以幫你決定一個版型要不要用。第一,把它套上你的品牌色與 logo 後,截圖給三個沒參與專案的人看,如果有人說「這看起來好眼熟」,那就該再改。第二,檢查版型裡的留白節奏與你的品牌調性合不合,活潑的品牌用太多對稱格線會顯得拘謹,穩重的品牌用太多斜切與不規則形狀會顯得輕浮。版型的功能是給你骨架,骨子裡的氣質還是要你自己決定。

另一個常見誤區是把版型庫當萬用解,什麼功能都想用版型硬塞。版型解決的是版面問題,功能性的需求(表單、購物車、會員、預約系統)要靠外掛,不是靠版型。想把功能補到位,可以參考一份好的 Divi 外掛清單,依實際需求挑選,不要為了版型好看而裝一堆用不到的外掛,那會拖慢速度也增加維護負擔。

手機版不是縮小版的桌機版:響應式與行動轉換的關鍵調整

這一段是整篇文章最想叮嚀你的地方,因為它同時是公司官網最容易掉單、也最容易補救的環節。

Statista 的統計(2026 年 4 月)顯示,全球網頁流量中,行動裝置長期占有很高比例。Google 也全面採用行動優先索引(Mobile-first Indexing),意思是主要使用網站的行動版內容進行檢索與索引,不是額外的「手機版排名加分」。

因此,行動版應保留與桌面版等值的主要內容、結構化資料與可抓取連結。行動體驗差也可能影響使用者完成任務,但不能表述成 Google 對網站施加「懲罰」。

一個常見的手機版陷阱

以室內設計工作室這類作品集網站為例,最容易踩到這個坑:作品集在桌機上是漂亮的兩欄並排,到手機卻拉成又長又空的瀑布流,訪客滑沒兩下就離開。問題不在作品不好,而在桌機的兩欄設計直接被手機繼承成單欄,沒有人重新思考手機上的閱讀節奏。解法是在 Divi 裡針對手機版重新排序圖文,把過場的留白砍掉,並讓每一個案例的第一張圖固定滿版,在手機上才有「看得到重點」的效果,調整完停留時間才會慢慢回來。

從這類案例得到的教訓是:響應式設計不是「自動縮放」就夠了,它是另一個需要獨立設計的介面。Divi 在這方面給了你很大的空間,每個欄位都能針對桌機、平板、手機分別設定排序、顯示與隱藏。想把這個機制用到位,可以先建立響應式網頁設計的整體觀念,再回頭操作 Divi 裡的手機版排序,例如用 CSS 調整行動版面順序的做法,能解決很多「桌機好看、手機悲劇」的問題。

手機版必檢的三件事

  1. 文字大小與按鈕點擊區:16px 可作為正文字級起點;44×44 CSS px 是常見的舒適觸控目標,但仍要搭配間距與真機測試。
  2. 行動呼籲容易找到:依頁面任務,把主要按鈕放在內容脈絡清楚且容易操作的位置,不必機械式塞在每個首屏。
  3. 表單欄位類型:只收集此階段必要資料,並設定正確的 input type 與 autocomplete,讓手機顯示合適鍵盤。

上線前的十一項檢查:SEO、速度、表單、安全、備份一次過

網站做好不等於可以上線。上線前,一定要跑過一份檢查清單,一項一項打勾。這份清單是一份實戰可用的版本,你可以直接拿去用。

SEO 與基本設定

  1. 確認固定連結結構:文章名稱是常見選擇,但不存在適合所有網站的唯一「最友善」格式。上線前確定結構;日後若更改,要為舊網址設定重新導向。SEO 外掛可協助管理標題、描述與社群預覽,選擇方式可參考 WordPress SEO 外掛比較
  2. 每個頁面都有獨立的 title 與 meta description:不要讓所有頁面共用首頁的標題,這是最常見的技術性 SEO 失誤。
  3. 提交 sitemap 到 Google Search Console:這能協助 Google 發現網址與回報處理狀態,但不保證收錄或排名。完整流程可參考 Google Search Console 指南
  4. 安裝 HTTPS 憑證:沒有 SSL 的網站,瀏覽器會直接標成「不安全」,訪客看到就會退出。先弄懂SSL 憑證與 HTTP、HTTPS 的差別,再決定要不要用主機商提供的免費憑證。

速度與效能

速度會影響使用體驗,Core Web Vitals 也是 Google 排名系統使用的訊號之一,但良好分數不保證排名。較慢的載入可能影響離站與轉換,實際幅度會因網站與受眾而異(web.dev 的速度研究)。

實測速度時,可依 web.dev 的 Core Web Vitals 指標,把第 75 百分位的 LCP 2.5 秒內、INP 200 毫秒內與 CLS 0.1 內作為「良好」門檻。先用真實使用者資料確認瓶頸,再處理圖片、快取與未使用資源;不要預設所有 Divi 網站都由相同原因變慢。

  1. 最佳化圖片:依顯示尺寸輸出、壓縮並使用合適格式;首屏主圖不要延遲載入。
  2. 設定快取:依主機、CDN 與網站動態功能選擇快取策略,設定後要測試登入、表單與購物流程。
  3. 檢查未使用資源:移除不需要的外掛與資源;CSS/JS 是否合併要以實測判斷,HTTP/2 或 HTTP/3 環境不一定適合盲目合併。完整做法可參考 網站速度優化

安全、表單與備份

  1. 測試每一張表單都能收到信:自己填一遍,確認信真的進到公司信箱,沒被擋到垃圾郵件。
  2. 安裝防垃圾留言機制:Akismet 這類外掛能擋掉大量機器人垃圾,詳細設定看Akismet 防垃圾指南。
  3. 設定自動備份:上線第一天就要有備份機制,用 UpdraftPlus 這類外掛排程每天備份到雲端。備份這件事千萬別用「應該不會出事吧」的心態帶過,完整做法參考UpdraftPlus 備份
  4. 強化登入安全:啟用強密碼、多因素驗證、登入速率限制與更新維護。更改登入網址只能減少部分雜訊,不能取代真正的存取控制。

這十一項跑完,你的官網才具備「可以對外開放」的最低標準。這份清單確實很無聊,但它就是那種「做了沒人稱讚、沒做一定出事」的工作,老實做完,之後睡得比較安穩。

上線之後才是開始:維運節奏與 SEO 累積

很多公司以為網站上線就結案了,這是最大的誤解。網站像一個店面,開幕那天才是經營的起點。上線後,你的工作分兩條線:維運內容累積

維運節奏:日週月三層

維運可拆成三個時間尺度,給你一個可以照表操課的節奏。

  • 每天:看一下網站能不能正常開、表單有沒有新的詢問進來。這只要三十秒,但能讓你在出事的第一時間知道。
  • 每週:檢查外掛與主題有沒有更新,有更新就挑離峰時段更新,並確認更新後網站沒壞。更新前先備份,這是鐵則。
  • 每月:跑一次完整的備份還原測試(確認備份真的能用)、看一次 Google Search Console 的錯誤報告、檢視當月詢問的來源頁面。

內容累積:把部落格變成你的長期資產

公司官網的核心頁面與部落格都可能帶來自然搜尋流量,關鍵在於是否符合搜尋需求。持續回答客戶問題的內容有機會累積曝光,但成效與存續時間不保證,仍要定期更新與衡量。

內容可從客戶常問問題切入,一題整理成一篇完整解答。發文頻率不必追求固定數字,應以能維持品質與更新為準。網站整體 SEO 規劃可參考 架站 SEOWordPress SEO 指南

也可圍繞核心服務,把內容組織成「主題叢集」:用總覽頁連到更深入的子題,子題也回連到主要頁面。內部連結有助於使用者導覽與搜尋引擎發現內容,但文章數量、時間與流量成長之間沒有固定公式。

別忽略成本這件事

公司官網的總成本從來不只是主機與授權。把人力時間、外掛訂閱、設計素材、維運工時全部算進去,才是一個誠實的數字。在專案一開始就建立這個成本觀念,能避免做到一半才發現預算失控。如果你還沒盤過,先把網站成本指南看過一遍,心裡會比較有底。很多公司會低估的,是上線之後每年的維運與內容產出費用,這條經常比第一年的架站費還高,提早預留才不會在第二年被迫讓網站荒廢。

結語:把公司官網當成一個會長大的資產來經營

用 Divi 架公司官網的價值,不只在視覺編輯,也在於內部能否持續維護。接手人、全域設定、權限與備份流程,會直接影響網站是否能長期運作。

如果你是第一次用 Divi 架站,別想一次到位。先求六個核心頁面上線,跑兩三個月蒐集真實訪客數據,再依據數據決定要不要加頁面、要不要進階客製。這比一開始就蓋一個想像中的大網站,務實而且有效。

給你的下一步行動方案

  1. 本週:把開工前那五件事(主機、網域、授權、素材、接手人)拍板定案,寫成一張文件,讓所有相關人員簽字確認。
  2. 下週:完成主機與網域採購,把 WordPress 與 Divi 裝好,並跑完整套全域設定,不要跳過任何一項。
  3. 第三到第五週:照六大頁面順序實作,每做完一頁就在手機上實測閱讀動線,不要等全部做完才看手機版。
  4. 第六週:跑完上線前十一項檢查,提交 sitemap 到 Google Search Console,選定離峰時段正式上線。
  5. 上線後:啟動日週月三層維運節奏,並排出部落格發文計畫,開始為公司存下長期的搜尋流量。

如果你在過程中發現公司的需求超過 Divi 能負擔,或內部實在沒有人能接手,那也是一個有價值的結論,代表你該認真考慮外包或代管。這個判斷最好在投入兩個月之前就做掉,別等到做完才發現走錯路。

公司官網是否值得投資,要回到可衡量的目標:詢問、預約、銷售、招募或降低客服成本。先完成開工前的五項決策,再開始建置。

常見問題

用 Divi 架站需要會寫程式嗎?
不用。Divi Builder 採 Row 與 Module 的拖曳組合,全程視覺化操作,不必碰 CSS 或程式碼也能做出完整頁面;需要進階自訂時再學一點 CSS,那是加分而非必要。
架設一個 Divi 網站總共要花多少錢?
主機年費、網域年費與 Divi 授權(Elegant Themes 提供一年期與終身版兩種)加總,遠低於委外動輒數萬到十幾萬的設計費;但別忽略上線後每年的維運與內容產出費用,這條經常比第一年的架站費還高。
自己架站和找網頁設計公司哪個划算?
看你的時間與預算。自己架省下設計費、換來完全掌控,但要投入學習與實作時間;委外省時間,但要付數萬到十幾萬,後續修改常另計費。折衷做法是委外把版型與全域設定做好,上線後的內容維護由內部接手,並在合約裡要求對方用你能接手的工具(例如 Divi)交付。
用 Divi 架公司官網大概要花多少時間?
從採購到上線大約一個半到兩個月,前提是開工前先把主機、網域、Divi 授權、品牌素材、接手人這五件事定案,並有一位同事願意投入學習與實作;若要做的是複雜會員系統、報名流程或報表後台,時程會再拉長。
Divi 網站上線前要檢查哪些事?
至少跑完十一項檢查:固定連結結構、每頁獨立的 title 與 meta description、提交 sitemap 到 Google Search Console、安裝 SSL 憑證、圖片與快取最佳化、清理未使用資源、實測每張表單都收得到信、防垃圾機制、自動備份與登入安全,全部打勾再對外開放。

操作步驟

  1. 開工前先回答三個問題:網站給誰看、要帶動什麼動作(詢問、訂閱、下單)、上線後誰維護;並把品牌定位、頁面結構、配色與字體先想清楚。
  2. 申購簡短好記的 .com 或 .tw 網域,從可信賴的註冊商購買。
  3. 選購主機(建議從中等級的虛擬專用或 Managed WordPress 主機起手,避開最便宜的共享主機),完成信件認證、DNS 指向、SSL 申請三步讓網站對外可連。
  4. 一鍵安裝 WordPress.org(自架站選 .org 版本而非 .com)。
  5. 從 Elegant Themes 後台下載 Divi 主題,到 WordPress 後台上傳、啟用並匯入會員 API 完成授權;先定好全站色彩計畫(主色、輔色、底色、文字色、成功與警告色等六類色票)、字體組合與 Logo。
  6. 用 Divi Builder 的 Row 與 Module 拖曳組出公司官網六個核心頁:首頁、關於我們、服務項目、案例或作品集、部落格或知識庫、聯絡我們,每頁設一個明確的下一步按鈕。
  7. 針對電腦、平板、手機三種裝置分別調整字級、間距與顯示順序,把 CTA 在手機版往上提,並在三種裝置實機預覽。
  8. 上線前完成技術、內容、轉換三層檢查:SSL 全站 https、永久連結結構、Sitemap 提交 Search Console、備份排程並測試還原、用外部信箱實測聯絡表單能收到信。

主題聚落|頁面編輯器(Elementor/Divi/Bricks) 看「WordPress 與網站架設」中樞 →

相關文章

褚崇名(Sliven) 創辦人・巫普斯科技有限公司

長期投入技術 SEO、GEO/AEO 與 AI 搜尋實務。本站文章以可驗證資料、公開來源與實作觀察整理而成。

完整作者介紹LinkedInGitHubX

想把這篇的方法用在自己的站上?

SEO 健檢、GEO/AEO 引用優化、網頁設計諮詢——把文章裡的方法落地到你的網站。