Elementor Website Builder － 不只是頁面編輯器

外掛說明

驅動全球 2,300 萬+ 網站的 No.1 無程式碼拖放式 WordPress 網站編輯器，正式迎來 Agentic AI。

Elementor 是領先的 WordPress 網站建立平台，透過無程式碼、拖放式的原子編輯器 (Atomic Editor)，助你順暢建立專業且像素級精準的網站。

Supporting the full website lifecycle, Elementor lets you build, optimize, and manage your website with extended capabilities such as agentic AI creation, native MCP connection, image optimization, transactional email delivery, accessibility tools, performance boosters, and more.

Elementor is now in version 4, with a new generation of performance-first atomic building blocks that put you in control of every part of your site. Define your global design systems and reusable components once, and they apply everywhere instantly – turning hours or even days of work into single clicks.

NEW! Connect your favorite AI tools, including Claude, Codex, and Cursor, directly to your Elementor sites. The Elementor MCP acts as a new execution layer, turning plain-language prompts into real, fully editable Elementor structures, layouts, and design systems while keeping you in complete control.

使用 Elementor Pro 解鎖所有 Pro 功能。

需要快速且安全的雲端主機來託管你的 Elementor 網站嗎？不妨試試由 Google Cloud 與 Cloudflare 提供支援的 Elementor Host。TrustPilot 評分為 4.9/5。

🌟 建立專業且令人驚豔的網站

• 直覺式拖放建構工具：使用我們免程式碼、拖放式的編輯器建立任何網站。透過完整掌控版面配置與樣式，實現精準設計。
• 像素級精準的設計工具：上傳 SVG、套用遮罩、漸層、方塊陰影與標題效果，加入形狀分隔線，並使用內建 CSS 控制項進行進階自訂。
• 範本庫：套用完整網站套件以立即完成設定，或從大量單頁、區塊與彈出式視窗範本中選擇。
• 進階小工具：存取 40+ 個免費小工具，包括標題、圖片、文字編輯器、影片、按鈕、圖庫、輪播等。
• WordPress 的 Agentic AI 功能：以自然語言描述你的需求，Elementor AI 就會建立：自訂小工具、區段、完整版面配置及 WordPress 程式碼片段，並交付可直接用於正式環境、完全可編輯且原生於網站的程式碼。

🗝️ 主要功能

• 設計系統：使用變數與類別，統一色彩、字體排版及設計元素，更新後即可同步套用至所有位置。
• 響應式設計：透過自訂斷點，針對各種裝置最佳化設計，確保桌機、平板與行動裝置都能提供順暢的使用體驗。
• Elementor MCP: Seamlessly connect external AI tools such as Claude, Codex, Cursor and more, to build native Elementor pages, sections, and design systems instantly. Bring in context from other tools like Figma and review or refine every generation in the visual Elementor Editor before publishing.
• 遮罩形狀：將任何元素（例如圖片或影片）轉換成你想要的形狀，打造醒目的設計。
• CSS 變形：使用 CSS Transform 旋轉、縮放及傾斜元素，為網站增添動態樣式。
• 進場動畫：為元素加入進場動畫，打造引人入勝且具互動性的使用者體驗。
• 修訂記錄：在創作過程中的任何時點追蹤並還原設計的先前版本。
• 開發者友善：提供豐富的文件、API、開發者工具及自訂程式碼區域，讓開發者能擴充 Elementor 並建立自訂解決方案。
• 浮動按鈕：新增可自訂的浮動動作按鈕，讓按鈕在使用者捲動時持續顯示於畫面中。
• 元件 [Pro]：在不同頁面與網站間重複使用相同的建置元件，並在其出現的所有位置同步更新；受控的內容編輯功能可讓協作者與客戶只更新已開放的內容屬性。
• 佈景主題建構工具 [Pro]：設計網站的每個部分：頁首、頁尾、文章與彙整頁面，完整掌控外觀。
• 彈出視窗編輯器 [Pro]：使用進階的目標設定與觸發選項建立彈出視窗，以最佳化使用者互動與轉換率。
• 表單 [Pro]：設計並整合自訂表單，搭配進階功能與整合服務來收集潛在客戶提交的資料。
• WooCommerce 編輯器 [Pro]：為商店設計自訂產品頁面、商店版面配置、彙整頁面、購物車、結帳頁面及帳號頁面。
• 動態內容 [Pro]：將設計連結至資料來源，建立個人化的互動式網站體驗。
• 備註 [Pro]：直接在設計介面留下意見與留言，提升團隊協作效率。
• 自訂程式碼 [Pro]：插入自訂程式碼以擴充網站功能，提供靈活的進階自訂方式。
• 自訂 CSS [Pro]：套用自訂 CSS，以精準微調元素的樣式。
• 動態效果 [Pro]：為元素加入動態效果，打造更生動且引人入勝的使用者體驗。
• 自訂字型與圖示 [Pro]：上傳並使用符合品牌識別的自訂字型與圖示。

😍 Elementor 免費小工具

使用一整套免費小工具與各項工具，支援網站建立流程：

• 標題：加入吸睛的標題。
• 圖片：控制大小、不透明度等設定。
• 文字編輯器：就像 WordPress 文字編輯器一樣。
• 影片：新增 YouTube、Vimeo、VideoPress、Dailymotion 或自架影片。
• 按鈕：建立互動式按鈕。
• Link in Bio：建立 Link in Bio 元件，推廣你的業務／服務。
• 圖片框：使用圖片、標題與文字建立方框。
• 客戶推薦：客戶推薦內容。
• 圖示：從 600+ 個可用圖示中放置一個或多個。
• 圖示框：使用單一小工具呈現圖示、標題與文字。
• 社群圖示：使用 Facebook/X（前稱 Twitter）圖示連結至社群頁面。
• 圖片藝廊：以網格顯示圖片。
• 圖片輪播：為選取的圖片建立旋轉輪播或滑動展示。
• 圖示清單：使用任何圖示建立項目符號清單。
• 計數器：以遞增方式顯示數字。
• 進度列：加入可逐步增加的進度列。
• 巢狀分頁：以垂直或水平分頁顯示內容。
• 巢狀手風琴：在可摺疊的區段中顯示任何類型的內容。
• 評分：顯示其他訪客給予的星級數（或其他圖示）。
• 警示：加入彩色警示框，吸引訪客注意。
• HTML：將程式碼插入頁面。
• 短代碼：將任何外掛的短代碼插入頁面。
• 選單錨點：將任何選單連結至此錨點。
• 閱讀全文：設定彙整頁面上內容摘要的「閱讀全文」截斷位置。
• 側邊欄：在頁面上加入側邊欄。
• Google 地圖：將地圖嵌入頁面。
• SoundCloud：加入 SoundCloud 音訊片段。
• 分隔線：使用精心設計的分隔線分隔內容。
• 間隔：在元素之間加入空間。
• 文字路徑：將文字附加至路徑。
• 以及更多。

🚀 強化你的網站

高效能網站：網站效能會影響訪客體驗與搜尋結果排名。Elementor 與 Google Chrome 合作，持續改善效能，同時不犧牲設計。

主要功能包括：

• 精簡 DOM 輸出：簡化 HTML 結構，加快呈現速度。
• 改善媒體檔案載入：最佳化圖片、影片及其他媒體資產的載入。
• 精簡 CSS 與 JS 檔案：將樣式表與指令碼個別最小化，僅在需要時載入，以加快載入速度。
• 延遲載入：延後載入非必要資源，以提升初次頁面載入速度。
• 加速字型載入：有效率地傳送網頁字型，提升文字轉譯速度。
• 最佳化前端資源載入：以有效率的方式載入 JavaScript 和 CSS 等資源，盡量減少轉譯阻塞。
• 元素快取：快取經常存取的設計元素，縮短伺服器回應時間並提升整體效能。

🔥 Elementor Editor Pro 功能

使用 Elementor Pro 的完整網站建構工具，在節省時間、金錢與資源的同時，建立無與倫比的網站。取得 100+ 個專業小工具、功能與工具。

Editor Pro 設計小工具：

1. 文章：以可自訂的版面配置與樣式顯示部落格文章。
2. 分享按鈕：讓訪客在各種社群媒體平台分享你的內容。
3. 作品集：使用作品集版面配置展示你的作品或專案。
4. 投影片：使用自訂動畫與轉場效果建立投影片集。
5. 表單：設計並自訂進階表單，供使用者互動及收集資料。
6. 登入：在網站中新增登入表單或使用者註冊模組。
7. WordPress 選單：自訂網站導覽選單的外觀與樣式。
8. 動畫標題：建立具有動畫效果、吸引目光的標題。
9. 價格表：以結構化格式顯示定價方案或套裝方案。
10. 價格清單：以可自訂的樣式展示價格或服務清單。
11. 圖片藝廊：建立具備版面配置選項並支援燈箱的圖片藝廊。
12. 翻轉框：加入翻轉動畫，突顯內容或功能。
13. 行動呼籲：透過專用區段鼓勵使用者互動並促成轉換。
14. 媒體輪播：展示圖片或影片等媒體檔案的輪播。
15. 推薦文輪播：以輪播格式顯示客戶推薦文，提升信任感。
16. 巢狀輪播：建立巢狀輪播，以組織更複雜的內容。
17. 循環輪播：在循環輪播中顯示內容，供使用者持續瀏覽。
18. 目錄：為較長的文章或指南產生目錄。
19. 倒數計時器：新增倒數計時器，為促銷活動或事件營造急迫感。
20. Facebook 粉絲專頁：將 Facebook 粉絲專頁動態內容或其他內容嵌入網站。
21. 區塊引文：提供時尚的格式選項來凸顯引言或推薦文。
22. 範本：儲存並重複使用設計範本，確保品牌形象與版面配置一致。
23. 評論：展示客戶評論與評分，建立信任與可信度。
24. Facebook 按鈕：新增按鈕，促進訪客與 Facebook 粉絲專頁或內容互動。
25. Facebook 嵌入：將 Facebook 貼文或內容嵌入網站。
26. Facebook 留言：在網站的頁面或文章中啟用 Facebook 留言。
27. PayPal 按鈕：整合 PayPal 按鈕，提供線上付款功能。
28. Stripe 按鈕：整合 Stripe 付款按鈕，安全地進行線上交易。
29. Lottie 小工具：加入 Lottie 動畫，提升視覺吸引力與互動性。
30. 程式碼醒目提示：使用語法醒目提示顯示程式碼片段，提升可讀性。
31. 影片播放清單：建立並自訂網站上的影片內容播放清單。
32. 大型選單：自訂進階選單，改善導覽並顯示複雜內容。
33. 畫布外：建立會滑入的畫布外區域，在不讓主要版面變得雜亂的情況下顯示額外資訊或選單。

Editor Pro 佈景主題小工具：

建立並自訂網站的所有重要部分，包括頁首、頁尾、404 頁面、全域彙整頁面等。

1. 文章標題：自訂個別部落格文章或頁面的標題。
2. 文章內容摘要：顯示部落格文章的簡短摘要或預告。
3. 文章內容：自訂部落格文章或頁面的主要內容區域。
4. 精選圖片：設定並自訂部落格文章或頁面的精選圖片。
5. 作者資訊框：在部落格文章中顯示作者資訊與簡介。
6. 文章留言：自訂網站留言區段的外觀與功能。
7. 文章導覽：加入相鄰文章的導覽連結，方便瀏覽。
8. 文章資訊：顯示部落格文章的其他資訊，例如作者與日期。
9. 網站標誌：上傳並自訂網站標誌，用於品牌識別。
10. 網站標題：自訂網站標題。
11. 頁面標題：自訂個別頁面的標題。
12. 搜尋列：加入搜尋列，讓使用者搜尋網站內容。
13. 導覽標記：顯示階層式導覽路徑，方便使用者瀏覽。
14. 網站地圖：產生網站地圖，改善搜尋引擎索引與使用者導覽。
15. 循環網格：設計並自訂網格版面配置，用於部落格文章彙整或商品清單。

Editor Pro WooCommerce 小工具：

在整個網站中設計並自訂完整的線上購物體驗。

1. 產品：以可自訂的版面配置與樣式顯示個別產品。
2. 導覽標記：在商店中顯示階層式導覽路徑，讓使用者更容易瀏覽。
3. 產品標題：自訂個別產品的標題。
4. 產品圖片：設定並自訂產品清單中的圖片。
5. 產品價格：顯示個別產品的價格。
6. 加入購物車：新增可自訂的加入購物車按鈕，方便購買。
7. 產品評分：顯示產品的評分與評論。
8. 產品庫存：顯示產品的庫存狀態。
9. 產品中繼資料：顯示產品的其他資訊，例如 SKU 與分類。
10. 產品內容：自訂產品描述的主要內容區域。
11. 簡短描述：顯示產品的簡短摘要或介紹文字。
12. 產品資料分頁：將產品資訊整理至分頁區段，讓資訊更有條理。
13. 其他資訊：顯示產品的其他詳細資料，例如尺寸和重量。
14. 相關產品：展示相關產品，鼓勵進一步購買。
15. 追加銷售：推廣追加銷售產品，提高平均訂單價值。
16. 產品：以可自訂設定的網格或清單顯示產品。
17. 自訂加入購物車：自訂特定產品的加入購物車按鈕。
18. WooCommerce 頁面：設計並自訂 WooCommerce 專用頁面，例如購物車與結帳頁面。
19. 產品分類：顯示產品分類，方便在商店中瀏覽。
20. 選單購物車：在導覽選單中顯示購物車圖示，方便存取購物車。
21. 購物車：自訂購物車頁面的外觀與功能。
22. 結帳：自訂結帳頁面的外觀與功能。
23. 我的帳號：自訂客戶帳號區域的外觀與功能。
24. 購買摘要：在結帳過程中顯示購買內容摘要。
25. WooCommerce 通知：自訂 WooCommerce 通知的外觀與功能，例如訂單確認訊息。

使用 Elementor Pro 建立專業網站

🔒 安全性與合規性

Elementor 以 ISO/IEC 27001、ISO/IEC 27017、ISO/IEC 27018、ISO/IEC 27701 及 SOC 2 Type II 等業界認證作為強大後盾。這些認證反映我們對健全安全措施及業界認可標準的承諾。

我們鼓勵透過 Bug Bounty 計畫進行合乎道德的安全性研究。我們與領先的漏洞獎勵服務合作，讓研究人員能夠回報我們服務中的漏洞，並由提供 24/7/365 服務的分流團隊處理。

更多資訊：信任中心。

♿ 無障礙最佳實務

Elementor 提供無障礙工具與強化功能，協助你為所有使用者提供更佳體驗。包括 HTML5 語意結構、完整的鍵盤導覽選單，以及持續改善功能與小工具。

🌐 已翻譯為 63+ 種語言，並支援 RTL

Elementor 支援多種語言、字體排版與 RTL，編輯器翻譯涵蓋超過 63 種語言。

它與 WPML、Polylang、TranslatePress、Weglot 等相容。若要協助翻譯，請透過 translate.wordpress.org 新增語言。請參閱如何翻譯及在地化此外掛程式指南。

🧩 第三方服務的使用

為改善使用者體驗，若啟用必要功能，Elementor 可能會使用下列第三方服務：

• 載入 Google Fonts，為網站加入更多字型。Google 的 服務條款 與 隱私權政策均適用。
• Elementor 的部分功能需要從 Elementor.com 載入資源。除非另有明確說明，否則這些資源不會用於追蹤，且需要你核准並手動選擇啟用。請參閱我們的 服務條款 與 隱私權政策，瞭解更多資訊。

📧 Elementor 的相關產品

圖片最佳化工具：壓縮圖片，提升網站效能，同時加快載入速度並維持高品質。

Site Mailer：無需 SMTP 外掛程式即可穩定管理電子郵件，確保通訊可靠。

Ally：改善身心障礙者使用網站的便利性。Ally 會掃描、偵測並修正關鍵無障礙問題，且適用於所有 WordPress 與 Elementor 網站。

管理：集中式控制台，可監控、最佳化及維護多個 WordPress 網站，無須在個別網站的管理介面之間切換。

Cookiez：符合 GDPR 與 CCPA 規範的 Cookie 橫幅，具備自動 Cookie 掃描、指令碼封鎖與同意記錄功能。

活動記錄：記錄 WordPress 網站上的每項變更、執行者、時間與請求來源（WP Admin、REST API、WP-CLI、WP-Cron 或 WP Abilities API），提供完整的稽核軌跡）。

= 📣 See what our users have …