MO STORIES
Elementor 入門教學 :如何新增第一個 Elementor 頁面
在安裝主題和 Elementor 之後,我們就可以使用 Elementor 為我們設計第一個頁面。 在之前的文章,我們大量的討論過如何建立 WordPress 網站,以及使用 SEO 策略建立流量。接下來,如果你想要讓你的網站更具吸引力,看起來更專業的話,我們需要會一點「網頁設計」。 網站設計就像是店面的實體裝潢,例如...

在安裝主題和 Elementor 之後,我們就可以使用 Elementor 為我們設計第一個頁面。
在之前的文章,我們大量的討論過如何建立 WordPress 網站,以及使用 SEO 策略建立流量。接下來,如果你想要讓你的網站更具吸引力,看起來更專業的話,我們需要會一點「網頁設計」。
網站設計就像是店面的實體裝潢,例如,進入咖啡廳,迎面而來的是白色牆面和綠色植物,乾淨透亮的落地窗,門口旁邊種著綠色植物,讓空間充滿了生氣和活力,還沒喝咖啡就吸了芬多精。
如果停留下來的人都是為了你內容的重點,而 Elementor 是用來吸引流量的亮點。
本文章我們會解釋 Elementor 的基本功能和使用方式,幫助你更快速上手並熟悉操作界面。
如何新增第一個 Elementor 頁面
Step1. 新增頁面
在後台找到頁面,點擊一下「新增頁面」。
進入頁面後,我們可以在上方找到「使用 Elementor 編輯」。

Step2. 介面操作
從上面的選擇功能為:
-
主功能

-
新增元素

-
網站設定

-
結構

Step3. 新增元素到頁面
使用拖曳式的設計,將元素移動到頁面編輯器。
▼ Elementor 網頁編輯器影片 – 由 Elementor 提供
▼ 頁面編輯器

如何將 Elementor Template 插入頁面
如何修改元素?
Elementor 新手使用教學
如果你是第一次使用 Elementor 的朋友,大叔將說明如何安裝和啟用 Elementor ,並解釋什麼是元素,和實例教你怎麼使用。
如何安裝和啟用 Elementor
Step1. 搜尋 Elementor
進入 WordPress 後台頁面,鼠標移動到「外掛」,再點擊一下「安裝外掛」。

Step2. 安裝 Elementor
進入外掛頁面後,在右側的搜尋框打上關鍵字「Elementor」,就可以找到「Elementor Website Builder。
點擊「立即安裝」並啟動它,即可。

Step3. 在後台找到 Elementor

什麼是元素?
進到 Elementor 的網頁編輯頁面的時候,在左側我們可以看到「元素」,而元素代表的是各種不同的功能,例如說:
- 標題
- 圖片
- 內容編輯器
- 按鈕等等
簡單說 Elementor 將過去我們需要透過「寫程式」才能做的網頁功能,將它們打包成一個一個的元素,並代表各種的功能來讓我們方便使用。

然後,我們只要使用「Drag and Drop 拖曳式設計」,就可以開始設計精美的網頁。
Elementor 基本元素與小工具介紹
元素是什麼?
導覽器:段、欄、元素是什麼?
基本元素介紹
專業版元素介紹
Link In Bio 元素

關於作者 | 10+ 經驗
MO 編輯
WordPress 效能優化專家 / MO Design Studio 共同創辦人
關注設計 × 工程的平衡協作,擅長以簡潔語言說故事。專門幫已有網站的品牌做速度升級。相信好網站不用重做,只需要正確的優化。
延伸閱讀

WordPress 網站架設教學:從零開始的完整步驟(2026)
>-...

WordPress 是什麼?2026 新手入門完整介紹(功能、費用、適合誰)
>-...

WordPress 手機跑版怎麼辦?RWD 問題排解完整指南(2026)
WordPress 網站手機跑版?90% 是 CSS 問題。這篇教你用 7 個步驟診斷和修復 RWD 問題,從 Viewport Meta Tag、CSS 衝突到外掛相容性,一步步排查。...
訂閱瘦生活電子報
每週一封故事信——分享如何用減法思維剔除雜訊、做對的事、過好生活。不說教,不推銷,只有真實的取捨紀錄。