Gutenberg Vs Elementor：2022 年哪個更好

已發表: 2022-06-16

Gutenberg 和 Elementor 是您在 WordPress 世界中可能遇到的非常常見的術語。在設計 WordPress 網站時，您可能會想到要使用哪個頁面構建器或網站編輯器。排在首位的頁面構建器是 Elementor。古騰堡編輯器也可能會引起您的注意。

Gutenberg 編輯器和 Elementor 頁面構建器都非常棒，選擇使用它們中的哪一個可能會讓人感到困惑，尤其是對於 WordPress 初學者來說。

在本指南中，我們將研究其中的每一個、如何使用它們以及基於特定指標的它們之間的一些關鍵比較。

古騰堡

什麼是古騰堡
古騰堡特色

元素

什麼是元素
元素功能

Gutenberg 和 Elementor 之間的主要比較

結論

古騰堡

什麼是古騰堡

它是默認的 WordPress 編輯器，也稱為塊編輯器。它於 2018 年推出，包含在 WordPress 5.0 中。

編輯器使用可用於將內容添加到帖子/頁面的塊，並且可以根據用戶的喜好設置樣式。

引入時，塊編輯器取代了經典編輯器。與經典編輯器相比，Gutenberg 易於使用，尤其是對於新手用戶。您不再需要在編輯器中添加 HTML 和 CSS 來添加內容並設置樣式。

然而，它仍處於增長階段，預計隨著時間的推移，它會提供更多功能，因為它仍在不斷開發和改進。

古騰堡特色

古騰堡有許多現有的功能。在這裡，我們將在編輯器中研究其中的五個功能。

塊

它包含內置塊，使您能夠在帖子或頁面中添加任何類型的內容，例如媒體和文本。

通過單擊其中的塊插入器，可以將這些塊添加到帖子或頁面中。

在編輯器中，您可以單獨添加每個塊，從而為您提供對每個塊設置的更多控制。

還有相當多的塊可用。可用塊的廣泛選擇使您能夠將不同的內容集添加到您的網站中。您還可以創建自定義塊以在您的網站中使用。

可重複使用的塊

它提供了一個選項來放置可重用的塊。可重複使用的塊是一組可以在您的網站內容中重複使用的塊。

可重複使用的塊被證明是相當節省的。這是因為您不需要重新創建部分以在網站的不同部分中使用。

以下是有關如何從特定塊創建可重用塊的示例屏幕截圖：

單擊“添加到可重用塊”鏈接後，您將彈出一個窗口，您需要在其中添加可重用塊名稱並保存您的更改。

（所見即所得）編輯

它引入了所見即所得（所見即所得）內容編輯器。這使您能夠編輯帖子或頁面中的內容，並能夠在發布之前預覽其顯示。

這是一個很棒的功能，因為您不再需要保存更改來預覽頁面或帖子的顯示。最初，這是以前的 WordPress 編輯器沒有提供的東西。

可調整的字體方面

該編輯器使您可以很容易地輕鬆調整內容的各種字體方面，例如字體大小和外觀。這使您能夠個性化站點內內容的顯示。

您對內容所做的任何字體更改都會立即在編輯器中可見。

拖放功能

編輯器使您能夠在頁面或帖子中拖放塊。這使您能夠更快地創建您喜歡的簡化佈局。

元素

什麼是元素

Elementor 是一個頁面構建器，可讓您在 WordPress 網站中設計高度可定制的佈局。

它是最受歡迎的頁面構建器之一。它的免費版本目前已安裝超過 500 萬次。

使用它時，您不需要任何編碼經驗來設計您的網站。它有相當多的小部件。這些使您能夠輕鬆地在您的網站中添加不同的功能。

頁面構建器還可用於各種網站類型，例如博客、電子商務網站、列表網站等等。對任何特定的內容類型都沒有限制。

元素功能

Elementor 具有廣泛的功能，使其非常適合網站開發人員和新手 WordPress 用戶。

其中一些功能包括：

響應能力

該構建器使您能夠為每種設備（移動設備、筆記本電腦和台式機）設計您的網站。這有助於確保您的網站實現像素完美的響應式設計，在每台設備上都能按預期工作。

這種響應能力是在基於設備屏幕尺寸的斷點的幫助下實現的。您還可以在 Elementor 的幫助下創建自定義斷點。

實時編輯和預覽體驗

使用 Elementor，您可以在頁面或帖子中進行編輯，並可以在進行編輯時進行預覽。例如，您無需保存頁面然後預覽它即可查看已完成的更改。

拖放功能

它在設計您的網站時提供拖放功能。您只需要將小部件拖到帖子或頁面中的畫布上。

此功能使其成為考慮的出色頁面構建器，尤其是對於新手用戶，因為不需要編碼知識。

現成的模板

它提供了 300 多個現成的模板，您可以在設計網站時使用這些模板。

您可以使用這些模板來創建任何行業類型的網站。添加到您的頁面後，您可以根據自己的喜好進一步自定義模板。

多個小部件

它包含多種小部件，可用於添加各種類型的內容。還有第三方插件可以輕鬆與構建器集成，以提供您可以在您的網站中使用的額外小部件。

Gutenberg 和 Elementor 之間的主要比較

Elementor 和 Gutenberg 都有許多相似之處，如上文所述。但是，它們實際上在不同方面確實優於彼此。以下是其中一些比較。

響應能力

Gutenberg 和 Elementor 都可以用來創建響應式網站。

使用 Elementor，您可以控制小部件在不同設備屏幕上的顯示。例如，您可以隱藏移動設備中的按鈕並使其僅在桌面和平板設備中呈現。您還可以為不同設備屏幕上的各種元素添加額外的樣式。此功能在設計您的網站時提供了額外的靈活性。

然而，在 Gutenberg 中，默認情況下您無法根據設備屏幕調整塊顯示，除非您使用添加此功能的主題或插件。

易於使用和理解

在使用 Gutenberg 時，您只需單擊塊插入器並選擇所需的塊即可輕鬆地在您的站點中添加塊。這個編輯器的一個缺點是它不是很直觀，用戶可能必須學習如何使用塊來正確設計佈局。

至於 Elementor，用戶只需將所需的小部件拖放到頁面並修改其內容即可呈現所需的內容。這是一種更簡單的方法，尤其是對於新的 WordPress 用戶而言。

表現

與 Elementor 相比，Gutenberg 獲得了更好的性能分數。

與使用 Elementor 設計的頁面相比，使用 Gutenberg 設計的頁面加載速度可能要快得多。

下面是使用 Elementor 構建的頁面與使用 Gutenberg 構建的頁面之間的示例性能比較：

使用 Elementor 的頁面

使用古騰堡的頁面

Elementor 具有更多的自定義功能和數據，因此與 Gutenberg 相比，這是導致性能得分較低的原因之一。 Gutenberg 也集成到 WordPress 本身中，與 Elementor 不同，您需要先安裝 Elementor 插件才能使用它來設計您的網站。

拖放

Gutenberg 和 Elementor 在設計網站時都提供拖放功能。

使用 Elementor，您可以將小部件拖放到其他小部件中，從而使您能夠創建複雜的佈局。然而，在 Gutenberg 中，此功能是有限的，因為您只能將塊拖放到您希望在列中呈現它們的位置，但不能真正將塊拖放到其他塊。例如，您不能拖動要在圖像上呈現的報價塊。相反，它將被渲染為圖像頂部的單獨塊。這使得在您的網站中構建複雜的佈局變得有點挑戰。

價錢

由於 Gutenberg 已集成到 WordPress 本身中，因此它是免費的。

另一方面，Elementor 既可以作為免費插件也可以作為專業插件使用。免費插件有點限制，特別是在現成的小部件和模板方面。要享受大量的小部件和模板，您將被迫從可用計劃中購買專業插件。

有四種不同的計劃可供選擇。其中包括：Essential、Expert、Studio 和 Agency。這些計劃中的每一個的定價差異很大程度上取決於將激活專業插件的網站數量。

結論

在本文中，我們研究了 Elementor 和 Gutenberg 的功能和比較指標。選擇使用哪一個完全取決於您。

如果您只想為您的網站構建一個簡單的佈局設計，那麼古騰堡將是合適的選擇。您還可以使用各種插件擴展默認的 Gutenberg 塊，例如 Spectra（以前稱為 Ultimate Addons for Gutenberg）和 Stackable。 Gutenberg 也預計會隨著時間的推移而增長，因此您應該期望看到一些更多現有的功能到位。

另一方面，如果您希望使用看似易於使用的構建器創建複雜的佈局，那麼 Elementor 將是一個不錯的選擇。

但是，如果您對其中任何一個有任何疑問，請隨時在下面的評論部分中與我們聯繫。