最佳 WordPress 所見即所得編輯器 – 7 個頁面構建器比較
已發表: 2018-12-10正在為 WordPress 尋找最好的 WYSIWYG 編輯器?
這篇文章基於我過去三年的經驗,當時我從一個拖放式 WP 編輯器切換到另一個。
我終於找到了一個我喜歡的,我會告訴下面是哪一個。
那麼為什麼你需要一個 WYSIWYG 的 WordPress 編輯器呢?
畢竟,WordPress 已經捆綁了一個名為 TinyMCE 的編輯器,它在技術上是一個所見即所得的編輯器。
我應該在這裡澄清一下,我所說的 WYSIWYG 編輯器是一個編輯器,您可以在其中準確地看到您在創建頁面或發佈時獲得的內容。
使用 TinyMCE,在您點擊“保存”然後預覽它之前,您並不確切知道輸出會是什麼樣子。
此處評論的 WYSIWYG 編輯器都允許實時前端編輯(Site Origin 的頁面構建器除外——更多信息見下文)。 這意味著當您編輯頁面或發佈時,您會看到與頁面上顯示的完全一樣的最終輸出。
這就是為什麼一個合適的 WYSIWYG 編輯器,又名拖放編輯器或可視化編輯器,對於需要快速上傳他們的文章或博客文章的忙碌博主來說是必不可少的。
我最近將我使用的可視化編輯器從 Site Origin 的 Page Builder Premium 更改為 Thrive Architect。 在採取行動之前,我做了很多研究:這些是我考慮過的競爭者。
披露:這篇文章中的一些鏈接是“附屬鏈接”。 這意味著如果您點擊鏈接併購買該商品,我將收到附屬佣金。
什麼是最好的 WordPress 所見即所得編輯器?
#1 - 視覺作曲家
Visual Composer 是最暢銷的 WordPress 拖放頁面構建器之一。 它絕對是最佳 WordPress 所見即所得編輯器的競爭者。
它有一個功能齊全的後端和前端編輯器,適用於任何 WordPress 主題。
Visual Composer 帶有超過 45 個內容模塊,包括:
- 後網格
- 媒體支持
- 圖表
- 幻燈片背景
- 輪播幻燈片
- YouTube
- 維密歐
- 自託管視頻
Visual Composer 的一些其他功能包括:
- 易於應用的部分、行和列的視差背景效果
- 支持 alpha 通道的 CSS 漸變背景
- 支持帖子、頁面和自定義帖子
- 支持 WordPress 簡碼
- 模板系統允許您將自定義設計元素保存為模板
- 針對 SEO 進行了優化,因此您的內容在關鍵字排名方面有一個良好的開端
- 在移動設備上完全響應
- 完整的修訂歷史記錄使您可以快速恢復到以前的工作版本
- 支持默認的 WordPress 小部件
- 側邊欄編輯器
- 標題編輯器
- 頁腳編輯器
- 在幾秒鐘內將您的 Visual Composer 模板從站點遷移到站點
- 與 Gutenberg 兼容 - 在頁面佈局中的任何位置添加 Gutenberg 塊
簡而言之
適用於基本佈局。 佈局和用戶界面不是很直觀。 與其他頁面構建器相比,內容元素的選擇並不多。
價錢
- 自由
- 每年 49 美元起
#2 - 站點原始頁面構建器
Site Origin 的頁面構建器擁有超過一百萬的活躍安裝量,是最受歡迎的 WordPress 頁面構建器之一。 它的受歡迎程度部分是由於它是免費的(儘管您可以購買高級小部件包)。
以下是一些功能:
- 適用於任何 WordPress 主題
- 為您添加的每一列選擇確切的行數
- 使用所有現有的 WordPress 小部件
- 響應式設計
- 支持帖子、頁面和自定義帖子類型
- 修訂歷史工具可讓您撤消更改
儘管 Site Origin 的 Page Builder 是免費的,但有一個 Premium Widget Bundle(29 美元),其中包括附加組件,例如:
- 手風琴
- 塊動畫
- 聯繫表
- 號召性用語小部件
- 燈箱
- 視差滑塊
- 感言
Site Origin Page Builder 與任何 WP 主題集成,因此它不會讓您使用特定主題。
它沒有其他 WordPress 可視化編輯器那麼多的樣式選項。 對於高級樣式,您需要熟悉 CSS。
Site Origin 有後端和前端編輯器。 但是前端編輯器並不像這裡評論的其他所見即所得編輯器那樣先進。

站點原始頁面生成器 - 後端
您在前端編輯器中所做的更改不會立即可見——您必須在頁面重新加載時等待幾秒鐘。
與其他編輯器相比,這使它感覺笨拙,並減慢了創建新博客文章的過程。

站點原始頁面生成器 - 實時編輯器
我在 Site Origin Page Builder 中發現的另一個問題是,很難找到插入元素的正確位置,例如新段落、新標題或新圖像。
在實時編輯器中,您只能在左側面板中添加元素(或模塊)。 但是很難知道您在左側面板中的位置。
如果他們添加這樣的功能會很棒:當您將鼠標懸停在右側面板中的元素上時,它會自動向下滾動左側面板並突出顯示左側面板中的相關塊。 這樣你就知道在哪裡插入你的新元素或模塊。
一年多前,我寫信給 Site Origin Page Builder 關於這個問題。 但他們顯然沒有接受。
最後一個考慮:
如果您卸載 Site Origin Page Builder,它會留下乾淨的 HTML 和短代碼的混合。 這意味著您使用 Site Origin 創建的頁面可能無法在其他頁面構建器中編輯。
簡而言之
Site Origin 的 Page Builder 與 Elementor 和 Thrive Architect 不同。 在我看來,它不是“最佳 WordPress WYSIWYG 編輯器”。
一方面,“實時編輯器”不是真正的前端編輯器。 您在編輯時不會立即看到更改 - 每次編輯後頁面重新加載都會有一個時間延遲。 這真的會讓你慢下來。
- Site Origin Page Builder可免費下載
- Site Origin Premium 起價為每年 29 美元
#3 - 分區生成器
Divi Builder 最初是 Elegant Themes 的 Divi 主題的一部分。 但它現在是一個獨立的頁面構建器,適用於任何 WordPress 主題。
其中一些功能是:
- 前端和後端編輯
- 完全響應式設計
- 支持帖子、頁面和自定義帖子
- 附帶 46 個頁面構建器模塊
- 快速和容易使用
- 允許您對不同的佈局進行 A/B 測試
- 支持自定義 CSS
簡而言之
Divi Builder 擁有超過 500,000 名客戶,是最受歡迎的 WordPress 編輯器之一。 它為不同類型的網站提供了 20 多種不同的佈局和模板
但是,Divi Builder 嚴重依賴於短代碼。 這意味著您無法切換到另一個頁面構建器。 實際上,您只能使用 Divi Builder。 這是一個嚴重的缺點,在我看來,它將它從最佳 WordPress 所見即所得編輯器的競爭中移除。
價錢
- 要下載 Divi Builder,您必須成為 Elegant Themes 的會員,每年 89 美元。
- 這也使您可以訪問由 Elegant 主題創建的每個主題和插件 - 不錯!
#4 - 元素頁面構建器
Elementor Page Builder 是一個相對較新的 WordPress 可視化編輯器(於 2016 年推出),但它的活躍安裝量已經超過 1,000,000。

它自稱是“世界領先的 WordPress 頁面構建器”。
據我所知,它是唯一的開源 WordPress 頁面構建器。 成千上萬的開發人員通過構建主題、附加組件和其他產品擴展了 Elementor 的核心功能。
以下是一些功能:
- 模板系統可讓您保存佈局並在網站的其他地方重新使用它們
- 允許您添加由其他 WordPress 插件創建的小部件
- 隨附 300 多個模板,旨在滿足每個行業和需求
- 真正的前端編輯 - 在編輯頁面時實時查看頁面
- 留下乾淨的代碼(如果您停用 Elementor)
- 使用 Elementor 的 Canvas 設計整個登陸頁面
- 超過 80 種設計元素,包括基本圖像和文本小部件到高級手風琴、滑塊、推薦信、圖標、社交媒體、標籤等
- 適用於任何 WordPress 主題和插件
- 修訂歷史允許您通過簡單的按鍵快速撤消任何錯誤
- 在您的頁面中嵌入 Facebook 帖子和視頻
- 支持響應式移動友好設計

Elementor 前端編輯
簡而言之
這是目前最先進的頁面構建器之一。 承諾成為最好的 WordPress 可視化編輯器,您可以確定不斷改進。
一個很大的優點是免費版本可以讓您訪問付費版本的大約 90%。 但是,Elementor 缺乏對轉換的任何關注,因此不是營銷人員的最佳選擇。
毫無疑問,有些人認為 Elementor 是最好的 WordPress WYSIWYG 編輯器。 但是,如果您的重點是最大限度地提高網站的轉化率,那麼我相信這個頭銜屬於 Thrive Architect。
價錢
- 自由
- 一次性費用 49 美元
#5 - 蓬勃發展的建築師
這就是我可能會失去一些客觀性的地方,因為我剛搬到 Thrive Architect(從 Site Origin Page Builder),我對它印象深刻!
Thrive Architect 基於 Thrive 之前的頁面構建器 Thrive Content Builder,它進行了大修和許多新功能。
Thrive Architect 從其他可視化編輯器中脫穎而出的地方在於它專注於轉換。 這就是為什麼它成為博主和營銷人員的最愛。
Thrive Architect 帶有可與所有主要電子郵件營銷工具集成的可自定義按鈕、推薦、倒計時計時器和潛在客戶生成表格。
如果您已經在使用 Thrive Leads,則只需單擊一下按鈕,就可以添加您的選擇加入表單。
我非常喜歡 Thrive Architect 的一個方面是能夠使用滑塊縮放圖像(在我之前的頁面構建器中,您只有 5 或 6 個固定尺寸):

Thrive Architect 中的另一個很酷的選項是能夠在圖像頂部放置一個著色層。
如果你真的想吸引人們的注意力,你可以添加動畫標題(我在下面的 gif 中使用了這兩種技術):

Thrive Architect 的類型焦點自動化
前端編輯絕對是一種享受——可能是所有可視化編輯器中最好的前端編輯體驗:

我喜歡 Thrive Architect 的另一件事是高級投影控件。
我喜歡在我的屏幕截圖周圍放置陰影,以便它們從文本中脫穎而出。 在我以前的編輯器中,沒有辦法做到這一點,所以我會在圖形應用程序中添加陰影 - 非常耗時。
使用 Thrive Architect,只需單擊一下!

Thrive Architect 的投影控件
還記得我說過 Thrive Architect 專門從事轉換嗎?
Thrive Architect 包含強大的登錄頁面構建器也就不足為奇了。
這些是您可以添加到登錄頁面的一些現成(但可自定義)部分:
- 社會證明/推薦部分
- 英雄形象部分
- 號召性用語部分
- 功能部分
- 工作原理部分
- 獎金部分
- 保證科
- 銷售漏斗
以下是 Thrive Architect 的一些其他功能:
- 移動友好的響應式設計
- 內置模板系統讓您
- 保存和加載佈局
- 修訂歷史和撤消和
- 重做按鈕進行更正
- 改變微風
- 樣式子彈點
- 列表(像這個)
- 特徵網格(帶有圖像或圖標)
- 動態倒數計時器
- 選擇加入表格
- 頁面事件 - 根據某些觸發器顯示燈箱彈出窗口
Thrive Themes 的團隊不斷向 Thrive Architect 添加新特性和新功能。 這確保了這個 WordPress 編輯器將繼續成為 WordPress 的最佳 WYSIWYG 編輯器。
簡而言之
Thrive Architect 是營銷人員或任何試圖將訪問者轉化為訂閱者或客戶的人的理想頁面構建器。 Thrive Architect 專門從事轉換,它擁有比我所知道的任何其他頁面構建器都多的轉換工具。 在外觀和感覺方面,Thrive Architect 經常與 Elementor 進行比較。 但與 Elementor 相比,我更喜歡 Thrive Architect 的 UI。 在我看來,Thrive Architect 是最好的 WordPress 所見即所得編輯器。
價錢
Thrive Architect 是 Thrive Suite 的一部分,每季度 90 美元
#6 - 海狸生成器
Beaver Builder 擁有超過 500,000 的活躍安裝,是最受歡迎的 WordPress 頁面構建器之一。 它也是最容易使用的工具之一——因此它是博客新手的絕佳選擇。
以下是 Beaver Builder 提供的一些功能:
- 適用於任何 WordPress 主題
- 實時前端編輯 - 在您做出更改時查看更改
- 支持 WordPress 小部件和短代碼
- 支持自定義 CSS 類和 ID
- 如果您卸載 Beaver Builder,您的內容將被傳輸到本機 WP 編輯器
- 針對移動設備進行了優化
- 附帶數十個預製頁面模板
- 提供滑塊、輪播、背景、內容塊、按鈕等模塊
我不得不說; 與 Elementor 或 Thrive Architect 相比,Beaver Builder 的用戶界面看起來有點基本:
簡而言之
Beaver Builder 對於初學者來說是一個很好的選擇,因為掌握它的竅門並不需要很好的學習曲線。 它提供的模塊不像其他一些頁面構建器那樣多。 從好的方面來說,如果您想恢復到 WordPress 編輯器,Beaver Builder 會留下 100% 乾淨的代碼。 因此,您將能夠在 WordPress 編輯器和大多數其他頁面構建器中編輯您以前的帖子。
價錢
- 第一年 99 美元,然後以 40% 的折扣續訂
#7 - 古騰堡 WordPress 編輯器
WordPress 總是帶有自己的預裝編輯器。 但是 WordPress 最近發布了一個全新的、完全免費的、名為 Gutenberg 的拖放編輯器。
Gutenberg 有一個非常乾淨、直觀的用戶界面:

古騰堡編輯器用戶界面
一旦您安裝了古騰堡,它就會成為默認編輯器——您不必選擇它。
古騰堡編輯器根據您插入頁面或通過單擊“加號”符號發布的塊進行操作:

古騰堡編輯器用戶界面
雖然與 WordPress 預裝的開源 TinyMCE 編輯器相比,Gutenberg 是一個巨大的飛躍,但它仍然缺乏您在付費頁面構建器中獲得的一些高級功能。
這是古騰堡隨附的積木示例
- 內容摘要塊
- 高級列表塊
- 按鈕塊
- 圖像塊
- 高級視頻塊
- 目錄塊
- 谷歌地圖塊
- 高級表格塊
- 手風琴塊
- 推薦塊
- 社交鏈接塊
雖然我喜歡乾淨整潔的界面,但我確實注意到了一些錯誤(在我使用的版本中):
- 很難從古騰堡內部編輯永久鏈接
- 項目符號列表必須位於其自己的塊中,否則塊中的整個文本都會變成項目符號
我應該在這裡提到古騰堡沒有得到很好的審查。 在官方 WordPress 網站上,Gutenberg 編輯收到了 1791 條評論,平均 2.2 顆星(滿分 5 星)。
簡而言之
Gutenberg 是一個優雅、整潔的拖放頁面構建器。 但在與上述任何頁面構建器競爭之前,它肯定需要做更多的工作。 誠然,它是免費的,但 Site Origin、Elementor 和 Visual Composer 都提供功能齊全的免費版本。
價錢
- 免費(包含在 WordPress 中)
總結 - 最好的 WordPress 所見即所得編輯器
當我搜索新的 WordPress 頁面構建器時,這些是我正在尋找的關鍵功能:
- 易於使用的界面
- 真正的前端編輯(即您在編輯頁面時立即看到更改)
- 在移動設備上完全響應
- 適用於任何 WordPress 主題
- 支持所有默認的 WordPress 小部件
- 模板系統,以便您可以保存自定義元素和佈局並重新使用它們
- 允許您快速恢復到以前版本的修訂歷史記錄
- 目錄模塊
- 支持自定義 CSS
- 留下乾淨的代碼
Elementor 和 Thrive Architect 似乎是兩個最先進的 WordPress 頁面構建器,它們都滿足我的最低要求列表。
我最終選擇 Thrive Architect 有兩個原因:
原因#1
當您在 Thrive Architect 中編輯頁面時,模塊位於屏幕的一側,每個模塊的控件位於屏幕的另一側。
但在 Elementor 中,模塊和控件位於屏幕的同一側。
這意味著您在 Elementor 中的點擊次數比在 Thrive Architect 中的點擊次數要多得多。 在 Elementor 中,完成段落、標題或圖像的樣式設置後,您必須單擊返回才能進入模塊菜單。
而在 Thrive Architect 中,模塊仍然存在,在屏幕的另一側。
原因#2
像大多數博主一樣,我試圖將訪問者轉化為訂閱者(並最終轉化為客戶)。
Thrive Architect 對轉換的關注是我的決定性因素。 Thrive Architect 中與轉換相關的模塊比任何其他 WordPress 頁面構建器都多。
相關文章
- 最佳博客文章格式 - 19 個格式化在線內容的技巧
- 如何構建博客文章——13 個關鍵要素
- 如何撰寫您的第一篇博客文章
