作者：Jacks｜JRM Web Design 顧問・英國生醫碩士・前保健品牌資深數位行銷 ｜ 最後更新日期：2026-11-07 ｜ 本文依 Elementor 官網（說明中心、定價頁、V4 常見問題）、WordPress.org 外掛頁與 Google 搜尋中心文件整理，各文件的更新日期與查詢日期列在文末參考資料。
你是不是也這樣想過：「網站明明是我的，為什麼換一張照片、改一行營業時間，都要等設計師排到下週？」如果你的網站是用 WordPress 加 Elementor 做的，很多小修改，老闆或小編自己就能動手。
這篇 Elementor 教學跳過「從零蓋一整個網站」，直接照官方說明帶你走一次「第一次自己改網站」的 7 步驟，順便把新舊介面（V3 與 V4）的差別、免費版和 Pro 的界線講清楚，最後附上動手前的 5 道保險。
先講結論：改字、換圖、加一個區塊這類小事可以自己來；全站設定、頁首頁尾和外掛大更新，先備份或先問人。按鈕名稱本文以官方英文說明為準，中文介面的翻譯可能略有不同。
Elementor 是什麼？先看懂它在 WordPress 裡的角色
Elementor 是裝在 WordPress 上的外掛型網站編輯器，用拖放的方式排版，不必寫程式；免費版在官方文件裡叫 Elementor Core[1][2]。
用開店來想：WordPress 是店面的建築本體，佈景主題是裝潢風格，Elementor 則是讓你自己搬貨架、換海報的工具。貨架怎麼擺，在畫面上拖一拖就看得到結果。
依 WordPress.org 外掛頁 2026-11-06 的資料，Elementor 的啟用安裝數超過 1,000 萬，目前版本是 4.3.6（2026-11-02 更新），免費版就有 40 個以上的小工具[1]。
動手之前，先確認主機和電腦符合官方的系統需求（2026-10-16 更新）[3]：
| 項目 | 官方需求 | 老闆白話 |
|---|---|---|
| WordPress | 6.8 以上，建議用最新版 | 在後台的「更新」頁面看得到目前版本 |
| PHP | 7.4 以上，官方強烈建議 8.3 以上 | 由主機商設定，不確定就請主機商協助升級 |
| 資料庫 | MySQL 5.6 以上，或 MariaDB 10.5 以上 | 換主機時再確認一次 |
| WP 記憶體上限 | 最低 256 MB，建議 512 MB，768 MB 效能最佳 | 編輯器面板載不出來時，先查這一項 |
| 瀏覽器 | Chrome、Edge 148 以上，Firefox 150 以上，macOS Safari 26.2 以上 | 把瀏覽器更新到最新版 |
| 裝置 | 只能在電腦上編輯（官方用詞是 desktop computers），手機和平板不行 | 想在手機上改版面，目前做不到 |
還沒有網站、想從頭架一個？先看WordPress 教學：新手架站 7 步驟；主機還沒選好的話，WordPress 主機怎麼選有 PHP 版本的說明。
Elementor 教學開始之前：安裝、啟用到打開編輯器
在 WordPress 後台的外掛頁搜尋「Elementor Website Builder」，按 Install Now 再按 Activate，免費版就裝好了；網站本來就是用 Elementor 做的，這一步可以跳過[2]。
- 登入 WordPress 後台（WP Admin），進入 Plugins > Add New Plugin。
- 在搜尋框輸入 Elementor Website Builder，找到圓形底、粉紅色 E 字標誌的外掛。
- 按 Install Now，幾秒後按鈕會變成 Activate，再按一次啟用。
- 設定精靈會問要不要建立 Elementor 帳號；有帳號可以使用範本庫，不想建立就按 Skip。
- 接著是安裝 Hello Theme、網站名稱和 logo 三個步驟，每一步都可以略過。
- 最後選「從空白畫布開始」或「套用範本」。
這裡有個小地雷：已經上線的網站，Hello Theme 那一步請按 Skip。官方說裝了之後還能換成別的主題[2]，但換佈景主題會動到整站外觀，這種事先問過當初幫你做網站的人。
之後要改哪一頁，就到後台打開那個頁面或文章，選 Edit with Elementor 進入編輯器[4]。
編輯器打不開？先對照系統需求頁的 4 個項目
編輯器載不出來或無法正常編輯時，先別急著重裝外掛。下表是從官方系統需求頁挑出的 4 個項目，照表檢查，再決定找誰處理[3]：
| 檢查點 | 官方說明 | 誰處理 |
|---|---|---|
| WP 記憶體上限 | 最低需要 256 MB；同時使用 WooCommerce 這類外掛時，可能要提高到 512 MB 才不會載入異常 | 主機商或維護網站的人 |
| PHP 版本 | 主機的 PHP 太舊可能出問題，官方建議請主機商升級到最新版 | 主機商 |
| 瀏覽器 | 舊版瀏覽器可能不支援完整功能；所有版本的 Internet Explorer 都不支援 | 自己更新瀏覽器 |
| 伺服器標頭 | X-Frame-Options 要設成 same origin；Content-Security-Policy 的 frame-ancestors 設成 none 會擋住編輯器預覽，要改成 self | 主機商 |
表裡最後一列看不懂沒關係，把它原封不動轉給主機商，對方就知道要查什麼。
編輯器介面 3 大區：頂部工具列、面板、畫布
Elementor 編輯器分成三區：上方的 Top Bar 放工具與設定，Panel（面板）放元素和選項，Canvas（畫布）就是你正在排的頁面[5]。
頂部工具列的控制項不少，新手先認識下面 6 顆就夠用（官方 2026-09-15 版）[6]：
| 按鈕 | 做什麼 | 什麼時候用 |
|---|---|---|
| Add Element | 打開元素清單，把文字、圖片等加進頁面 | 要新增內容時 |
| History | 看這一頁做過哪些變更，也可以從這裡復原 | 改錯想回頭時 |
| Responsive views | 在電腦、平板、手機檢視之間切換 | 發佈前檢查手機版 |
| Structure | 開啟結構視窗，快速找到頁面上的元素 | 元素不好點選時 |
| Preview | 用訪客看到的樣子預覽頁面 | 按發佈之前 |
| Publish（或 Update） | 讓頁面上線，或更新已上線的頁面；旁邊的選項可以存成草稿或範本 | 確認沒問題之後 |
工具列最左邊的 Elementor 標誌裡還有 Site Settings（全站設定），它管的是套用到整個網站的全域顏色、字型和版面[6][4]。先記得有這個地方，後面的分工表會說明為什麼別急著動它。
第一次自己改網站的 7 步驟：改字、換圖、加區塊
流程是：打開頁面、改文字、換圖片、加容器和小工具、調樣式、檢查手機版、預覽後發佈，主要在畫布、面板和頂部工具列完成[5][6][7][8]。
步驟 1：打開要改的頁面
在後台找到那一頁，選 Edit with Elementor。畫布上如果看得到頁首和頁尾，滑鼠移上去時它們會變色；點進去會切換成編輯那個「網站部件」，而不是這一頁[5]。第一次練習，先別點它們。
步驟 2：改文字
點選要改的標題小工具，面板會出現它的設定，共有 Content、Style、Advanced 三個分頁，文字在 Content 分頁裡改[5][7]。這是 V3 小工具的樣子；V4 原子元素是 General、Style 兩個分頁，下面有對照表。
步驟 3：換圖片
換圖時會打開 WordPress 媒體庫，選 Upload Files 上傳新圖。官方教學提醒，加圖時最好一併填寫 Alt Text（替代文字）和說明文字，對 SEO 和無障礙都有幫助[7]。
步驟 4：加一個新區塊
在畫布上按 + 號，選一個容器（Container）版型，決定裡面的東西要直排還是橫排，再從面板把 Heading、Button 這些小工具拖進去[5][7]。容器是現在的排版單位，官方說它取代了舊的「段與欄」（sections and columns）[7]。
拖不準的時候還有第二招：先在畫布上點選位置，再點面板裡的元素，它就會出現在你選的地方[9]。
步驟 5：調樣式
容器的設定有 Layout、Style、Advanced 三個分頁，V3 小工具則是 Content、Style、Advanced[5]。文字顏色和字型在 Style 分頁調整[7]。如果是整個網站的主色都要換，那是 Site Settings 的工作，不要一頁一頁手動改。
步驟 6：檢查手機版
按頂部工具列的 Responsive views，切到手機檢視[6]。在 V4 的元素上，設定預設會從大螢幕往小螢幕繼承：桌機的標題字級設 24，平板也會是 24，除非你另外改；元素也可以設定成在某個螢幕尺寸隱藏[10]。
為什麼一定要看手機？Google 的官方文件這樣寫：Google 用網站的行動版內容來建立索引和排名，並且建議採用回應式網頁設計[11]。想多了解可以讀響應式網頁設計是什麼。
步驟 7：預覽，再發佈
先按 Preview 用訪客的角度看一次，滿意了再按 Publish，已上線的頁面則是 Update[8][6]。還沒改完的話，按鈕旁的箭頭裡有 Save Draft；官方說存成草稿不會破壞已經發佈的頁面[8]。
V3 和 V4 差在哪？面板長得不一樣先別緊張
Elementor 4 導入「原子元素」（Atomic Elements）架構，和舊元素並存：新安裝的網站預設啟用，既有網站更新後版面不會變，也不必重做[12]。
官方的說法是，2026 年 4 月起，所有新的 Elementor 網站預設使用第 4 版；既有網站更新後「不會有任何變化」，主要的差別是多一則新原子元素的提示，可以選擇啟用或略過；新舊元素也能放在同一頁混用[12]。
你找到的其他 Elementor 教學，畫面如果和你的不一樣，可以先確認是不是版本不同。官方整理的主要差異如下[13]：
| 項目 | V3（舊元素） | V4（原子元素） |
|---|---|---|
| 設定分頁 | Content、Style、Advanced 三個 | General、Style 兩個，Style 的選項所有元素一致 |
| 統一樣式的方法 | 全域顏色、全域字型 | 類別（Classes），同一組樣式可以重複套用 |
| 手機版調整 | 在選項面板裡做，只有標記的選項能調 | 從頂部工具列切換裝置，所有選項都能調 |
| 漸層背景 | 最多兩個顏色 | 顏色數量不限 |
| 還原預設值 | 許多選項有還原按鈕 | 沒有還原按鈕 |
要不要付費才能用 V4？不用，Elementor 免費版就能用。官方說第 4 版不是新的訂閱或產品，核心功能維持免費，也不需要 One 訂閱[12]。另外，Grid、Loop 這類進階版面目前還沒有原子元素版本，官方說仍在開發中[12]。
速度方面，官方說原子元素少了多餘的包裝層，輸出的程式碼比較乾淨，有助於 Core Web Vitals；但也說新舊元素混用時效果會有差異，頁面上沒有提供具體數字[12]。Core Web Vitals 是 Google 用來衡量真實使用者體驗的一組指標，看載入、互動和版面穩定[14]。想查自己的網站慢在哪，可以對照網站速度優化：網站變慢的 6 大原因。
舊網站想試 V4 的話，官方的路徑是後台 Elementor > Editor > Settings 的 Atomic Editor 分頁，並且提醒：在正式網站啟用新功能或實驗功能之前，一定要先做完整備份[15]。
同一頁另外寫到，執行 Elementor 4.x 以上的網站預設啟用 V4 元素[15]，和上面常見問題頁的說法略有出入，實際以你後台 Atomic Editor 分頁的狀態為準。
Elementor 免費版與 Elementor Pro 差在哪？費用怎麼看
Elementor 免費版已經有拖放編輯器、手機版編輯和修訂紀錄；表單、文章列表、頁首頁尾（Theme Builder）和彈出視窗要 Elementor Pro[16][17]。
下表依官方的免費版與 Pro 對照表（2026-11-05 更新）和定價頁整理[16][17]：
| 功能 | 免費版（Core） | Pro |
|---|---|---|
| 拖放編輯器與基本小工具（Heading、Image、Button 等） | 有 | 有 |
| 手機版編輯（Mobile Editing） | 有 | 有 |
| 修訂紀錄與復原（Revision History、Redo / Undo） | 有 | 有 |
| 範本庫（Template Library） | 有 | 有 |
| 表單（Forms） | 沒有 | 有 |
| 文章列表、作品集（Posts、Portfolio） | 沒有 | 有 |
| 頁首頁尾與文章版型（Theme Builder） | 沒有 | 有 |
| 彈出視窗（Popup Builder） | 沒有 | Advanced Solo 以上方案才有 |
費用方面，官網定價頁在 2026-11-06 顯示的年繳方案如下（美元，未含稅）[17]：
| 方案 | 年費 | 可用網站數 | 重點 |
|---|---|---|---|
| Essential | US$60 | 1 個 | 含 Theme Builder、表單；不含彈出視窗、自訂程式碼與電商功能 |
| Advanced Solo | US$84 | 1 個 | 加上彈出視窗、自訂程式碼與 CSS、電商功能 |
| Advanced | US$108 | 3 個 | 功能同 Advanced Solo，雲端範本可存 30 個（Solo 為 20 個） |
| One | 首年 US$180，續約 US$228 | 1 個 | Pro 功能加上 AI、圖片最佳化、無障礙等工具，每月 25,000 點數 |
價格依 2026-11 官方公開資訊，促銷與續約價會變動，實際以官網結帳頁為準。官方另外註明，30 天退款保證只適用於年繳方案[17]。
Elementor One 方案在賣什麼
Elementor One 是官方把編輯器和旗下其他產品整合成單一訂閱的方案，用每月點數的方式使用 AI、圖片最佳化、無障礙、寄信等功能，分成單一網站版和不限網站數的代理商版[18][17]。只想改改文字和圖片的老闆，不訂它也能照本文的步驟操作。
Pro 不續約會怎樣？
官方的說明是：不續約就不能再更新 Elementor Pro、不能在網站上新增 Pro 功能，既有的 Pro 功能可能只剩部分可用；屬於免費版的部分會繼續運作。官方也提醒，只更新免費版而不更新 Pro，可能造成相容性問題[19]。續約與否，最好和幫你維護網站的人一起決定；維護的項目和行情可以看網站維護費用怎麼算。
利益揭露：JRM 的網站建置服務使用 Elementor，所以我們對這個工具並不中立；本文沒有聯盟行銷連結，功能與價格都以官方頁面為準。
動手前 5 道保險：改壞了也有退路
復原與操作紀錄、修訂版本、草稿、範本，加上更新前的備份，一共 5 道保險；先知道退路在哪裡，再放心動手。
下表依官方文件整理，從最輕的後悔藥排到最重的[20][8][21][22][23]：
| 保險 | 救得回什麼 | 在哪裡 |
|---|---|---|
| 1. 復原與操作紀錄 | 這一次編輯過程中的每個動作 | Ctrl+Z（Mac 為 Cmd+Z）；History 面板的 Actions 分頁 |
| 2. 修訂版本 | 之前每一次儲存或發佈的版本 | History 面板的 Revisions 分頁 |
| 3. 存成草稿 | 改到一半、還不想讓訪客看到的內容 | Publish 或 Update 旁的箭頭，選 Save Draft |
| 4. 存成範本再複製 | 想大改版面時，先複製一頁來練習 | 同一個箭頭選 Save as Template，再從範本庫的 My Templates 插入 |
| 5. 備份、測試站與版本回復 | 外掛更新之後出問題 | 更新前先備份、先在測試站試；後台 Elementor > Editor > Home 的 Tools > Version Control 可回復上一版 |
第 1 道的 Actions 只記錄「這一次」編輯的動作；第 2 道的 Revisions 則是每次儲存或發佈就多一筆[20]。能保留幾筆修訂版本，官方說是由 WordPress 的修訂設定決定，不是 Elementor 編輯器直接控制的[24]。
第 4 道怎麼做：存成範本，再複製一頁來練
想大改某一頁，又怕改壞原本的版面？官方的做法是先把頁面存成範本，再插入到新頁面，等於複製一份來練習[21]：
- 打開要當作範本的頁面。
- 在頂部工具列按 Publish 右邊的箭頭，打開儲存選項。
- 選 Save as Template（這一頁官方寫作 Save as a Template），取一個看得懂的名字，按 SAVE。
- 新增一個頁面並進入編輯器，在畫布上點資料夾圖示，打開範本庫。
- 切到 My Templates，找到剛才存的範本，按 Insert。
第 5 道是外掛更新前才用得到的，別跳過。官方對更新的建議是：外掛保持在最新版是好事，但強烈建議先在測試站（staging）試過，並且定期備份；要回復舊版之前，也要先備份[22][23]。保險要在出事之前買，網站的保險也一樣。
哪些自己改、哪些先問人？一張分工表
判斷標準只有一個：這個動作影響「一頁」還是「整站」。只影響一頁的可以自己來，會動到整站的先備份、先問當初做網站的人。
下面依官方文件對各項功能的說明，整理出分工建議[4][6][16][15][21][22][19]：
| 想做的事 | 影響範圍 | 建議 |
|---|---|---|
| 改文字、換圖片、改按鈕文字 | 一頁 | 自己來，改完切到手機檢視看一次 |
| 新增一個活動頁或消息頁 | 一頁 | 自己來，先用範本複製現有版面 |
| 改全站主色、字型（Site Settings） | 整站 | 先問人；官方說這裡的設定會套用到全站 |
| 改頁首、頁尾（Theme Builder） | 整站 | 先問人；這是 Pro 的功能 |
| 更新 Elementor、開啟 V4 或實驗功能 | 整站 | 先備份、先在測試站試 |
| 決定 Pro 要不要續約 | 整站 | 和維護網站的人一起決定 |
如果你打算讓 AI 工具直接修改 Elementor 頁面，開放之前該檢查的事整理在Elementor MCP 上線：老闆先看這 5 件事。
回到開頭的問題：換一張照片、改一行營業時間，不必再等到下週。這篇 Elementor 教學的重點就兩件事：照 7 步驟做，動手前確認 5 道保險都在。今天就挑一頁最不重要的頁面，先存成範本，練習改一個標題。
網站是別人做的，不確定哪些地方能自己動？JRM 提供免費網站健檢：我們會看收錄、手機版、速度、安全和網站結構，把該先修的項目列成一張清單給你，做不做由你決定。
→ 先看免費網站健檢怎麼做 ｜ 聯絡 JRM
常見問題
Elementor 的費用是多少？
Elementor 有免費版，可以從 WordPress 後台的外掛頁直接安裝。付費的 Elementor Pro 依官網定價頁 2026-11-06 的資料，年繳方案從 Essential 每年 60 美元（1 個網站）起，Advanced Solo 為 84 美元，可用於 3 個網站的 Advanced 為 108 美元。價格未含稅，實際以官網結帳頁為準。
Elementor One 是什麼？
Elementor One 是官方把編輯器 Pro 功能和 AI、圖片最佳化、無障礙、寄信等工具整合成單一訂閱的方案，以每月點數計算用量。依官網定價頁 2026-11-06 的資料，單一網站版首年 180 美元、續約 228 美元。使用第 4 版編輯器不需要訂閱 One。
Elementor 可以用手機編輯嗎？
不行。官方系統需求寫明，目前只能在電腦上用 Elementor 編輯頁面，手機和平板不能編輯。不過可以在電腦的編輯器裡切換到手機檢視，調整手機版的版面。
更新 Elementor 會讓版面跑掉嗎？
官方的說法是更新不應該影響現有設定，多數時候更新都能正常運作；但官方也說無法保證特定環境不出問題，所以強烈建議先在測試站試過，並且定期備份。出問題時，可以從後台的 Version Control 回復上一版。
Elementor Pro 不續約，網站會壞掉嗎？
官方的說明是，不續約就不能再更新 Pro、不能新增 Pro 功能，既有的 Pro 功能可能只剩部分可用，屬於免費版的部分會繼續運作。只更新免費版而不更新 Pro，可能出現相容性問題。
Elementor 模板去哪裡找？
模板在官方文件裡叫範本（Template）。在編輯器的畫布上點資料夾圖示，會打開範本庫，上方有 Blocks、Pages 和 My Templates；自己存的範本在 My Templates。官方說建立 Elementor 帳號後可以使用範本庫。
參考資料
[1] WordPress.org（查詢日期 2026-11-06）. Elementor Website Builder 外掛頁（台灣正體中文）. 連結
[2] Elementor Help Center（2025-07-01 更新）. Install & activate Elementor Core. 連結
[3] Elementor Help Center（2026-10-16 更新）. Elementor System Requirements. 連結
[4] Elementor Help Center（2026-09-15 更新）. Configure Site Settings. 連結
[5] Elementor Help Center（2025-10-08 更新）. Explore the Elementor Editor. 連結
[6] Elementor Help Center（2026-09-15 更新）. Elementor Top Bar. 連結
[7] Elementor Help Center（2026-05-17 更新）. Use containers to build your first page. 連結
[8] Elementor Help Center（2024-09-29 更新）. Preview & publish your page. 連結
[9] Elementor Help Center（2024-10-28 更新）. Add elements to a page. 連結
[10] Elementor Help Center（2026-10-23 更新）. Responsive editing. 連結
[11] Google Search Central（2025-12-10 更新）. Mobile site and mobile-first indexing best practices. 連結
[12] Elementor（查詢日期 2026-11-06）. Version 4 FAQs. 連結
[13] Elementor Help Center（2025-05-19 更新）. What are the differences between the Elementor Editor V3 and V4? 連結
[14] Google Search Central（2025-12-10 更新）. Understanding Core Web Vitals and Google search results. 連結
[15] Elementor Help Center（2026-09-02 更新）. Get started with the Elementor Editor V4. 連結
[16] Elementor Help Center（2026-11-05 更新）. Elementor Benefits – Pro VS Free. 連結
[17] Elementor（擷取日期 2026-11-06）. Elementor website builder pricing. 連結
[18] Elementor Help Center（2026-10-20 更新）. What is Elementor One? 連結
[19] Elementor Help Center（2026-06-03 更新）. What will happen to my website(s) if I don’t renew Elementor Pro? 連結
[20] Elementor Help Center（2026-09-15 更新）. Revision history, undo and redo. 連結
[21] Elementor Help Center（2026-09-15 更新）. Make a template from an existing page. 連結
[22] Elementor Help Center（2023-08-17 更新）. Should I update Elementor? 連結
[23] Elementor Help Center（2026-09-15 更新）. Rollback to a previous version of Elementor. 連結
[24] Elementor Help Center（2026-09-25 更新）. How many versions of a post does Elementor store? 連結
