Beaver Builder 評論:深入了解流行的 WordPress 頁面構建器插件

已發表: 2021-07-16
海狸生成器插件評論
關注@Cloudways

Beaver Builder 一定會出現在任何 WordPress 頁面構建器插件列表中。 但是流行的插件值得它的鹽嗎? 它是否具有適合您的功能,並且使用它構建出色的 WordPress 網站是否容易? 你甚至如何在 WordPress 上安裝插件? 您將在此深入且經過徹底測試的 Beaver Builder 評論中獲得所有答案。

從正確的角度來看,Beaver Builder WordPress 插件是一個頁面構建器,它使用拖放方法使網站設計在公園裡散步。 它讓您可以直接在網站的前端工作,並在旅途中創建令人驚嘆的網站,而無需任何編碼技能。

本質上,使用像 Beaver Builder 這樣的頁面構建器就像玩樂高積木一樣。 您挑選碎片(元素和模塊)並將它們組合在一起以創造您的想像力。 使用優秀的頁面構建器構建網站就是這麼容易。

因此,如果這就是您正在尋找的內容,那麼讓我們直接進入這個終極 Beaver Builder 評測吧!

  • Beaver Builder:概述
  • 強大的功能和控制
  • 易於使用和集成
  • 可定制的模板
  • 響應式網站
  • Beaver Builder 功能和優點
  • Beaver Builder 定價
  • Beaver Builder 的系統要求
  • 瀏覽器兼容性
  • WordPress 版本
  • jQuery 版本
  • 如何在您的 WordPress 網站上安裝 Beaver Builder?
  • 免費(精簡版)版本
  • 高級版
  • 許可證激活
  • 如何使用 Beaver Builder(實踐)
  • 預建模板
  • Beaver Builder 與 Cloudways 的兼容性和性能
  • 我們使用的資源:
  • GTMetrix 性能分析
  • Pingdom 性能分析
  • PageSpeed Insight 性能分析
  • Beaver Builder:優點和缺點
  • Beaver Builder 的不兼容性
  • 插件衝突
  • 主題衝突
  • 異步 Javascript 插件
  • 複印機插件
  • Cloudflare 的火箭裝載機
  • Cloudways 用戶對 Beaver Builder 的評論

Beaver Builder:概述

海狸生成器概述

Beaver Builder 為您提供了一種用於創建內容的默認 WordPress 塊編輯器的替代方案,使用類似但更全面的模塊系統。
市場上有許多頁面構建器插件,但 Beaver Builder 因其易用性而成為最受歡迎的選項之一。 Beaver Builder 有免費版和高級版。 在這篇評論中,我將專注於高級版本並分享我對所有功能和性能的體驗。

強大的功能和控制

頁面構建器插件之間的根本區別在於它們提供的自定義選項以及它們為您提供對所有這些元素的控製程度。 但是,無論提供多少功能,許多頁面構建器都很難使用。

易於使用和集成

但 Beaver Builder 屬於後一類,它提供了大量出色的特性和功能,並捆綁在一個易於使用的軟件包中。 該插件的前端可視化編輯體驗還可以讓您看到頁面,因為它在您編輯時會向訪問者顯示,這很棒。

頁面構建器還允許您編輯帖子和自定義帖子類型。 此外,它適用於大多數 WordPress 主題,並與大多數生成短代碼或小部件的插件很好地集成。

可定制的模板

但是,如果您不想從頭開始構建頁面,Beaver Builder 還附帶了一個預製的可定制模板庫。 您可以保存您創建的任何頁面以將其佈局重複用於其他內容,並且您可以對添加的任何行、列或模塊執行相同的操作。

響應式網站

最後,值得注意的是,Beaver Builder 使您能夠開箱即用地構建響應式網站。 您可以隨時預覽頁面在台式計算機、智能手機和平板電腦上的外觀。

在紙面上,Beaver Builder 聽起來令人印象深刻。 在接下來的部分中,我將向您展示它是如何工作的。

Beaver Builder 功能和優點

到目前為止,您已經清楚地了解了 Beaver Builder 提供的功能及其工作原理。 在我向您展示插件的界面之前,讓我們簡要回顧一下它的功能:

  • 拖放式前端可視化頁面構建器
  • 33個模塊添加內容
  • 可用於啟動內容創建的預建頁面模板
  • 與大多數 WordPress 主題以及生成短代碼和小部件的插件集成
  • 完全可定制的頁面和自定義帖子類型。

這些都是很棒的功能,但是您需要花多少錢來獲得這些功能來構建您的網站? 讓我們來看看插件的定價!

Beaver Builder 定價

正如我之前提到的,Beaver Builder 有免費和付費版本​​。 但是,如果您打算將 Beaver Builder 用於個人項目(如業餘愛好博客)之外的任何內容,您可能需要高級版本。

Beaver Builder Pro 許可證起價為 99 美元,無限站點更新一年,年度續訂可享受 40% 的折扣。 這是標準計劃,這是我向大多數構建電子商務、商業或專業博客網站的個人用戶推薦的選項。

有更昂貴的計劃提供更多功能,例如:

  • WordPress 多站點支持
  • 官方 Beaver Builder 主題,旨在與插件無縫協作
  • 白標功能。

如果您正在為代理項目尋找頁面構建器,您應該考慮更昂貴的 Beaver Builder 計劃之一。 除了這些場景之外,標准許可證還為您提供所需的一切。

Beaver Builder 的系統要求

現在讓我們來看看 Beaver Builder 的系統要求。

瀏覽器兼容性

您可以使用 chrome、firefox、safari 和 edge 瀏覽器的三個最新版本。 對於 Internet Explorer 用戶,建議使用 IE 11。

WordPress 版本

我建議使用最新版本的 WordPress 和 PHP,以獲得更好的安全性和性能。 有關 WordPress 更新和說明,您可以查看 WordPress 文章。

  • Beaver Builder 插件: WordPress 4.6 及以上 | PHP 5.6.20 及以上(推薦 PHP 7.x)

注意:自 4.9.6 以來的 WordPress 版本需要 Beaver Builder 版本 2.1.1.3 或更高版本。

  • Beaver Builder 主題:WordPress 4.1 及以上 | PHP 5.6.20 及以上
  • Beaver Themer : WordPress 4.6 及以上

jQuery 版本

Beaver Builder 支持與 WordPress 捆綁的 jQuery 版本。 不建議使用其他 jQuery 版本,因為雖然它可能有效,但最終可能會損壞您的站點。

因此,在安裝之前,請確保您遵循要求以避免任何障礙物並順利到達所需的站點。

如何在您的 WordPress 網站上安裝 Beaver Builder?

現在是在 WordPress 上安裝 Beaver Builder 的時候了。 Beaver Builder 提供免費(精簡)版和高級版,並且易於安裝。 我將一一分享兩個版本的安裝過程。

免費(精簡版)版本

轉到WordPress 儀表板 > 插件 > 添加新的。

WordPress儀表板

在右側的搜索欄中搜索 Beaver Builder。 單擊安裝按鈕,然後激活它。

搜索 Beaver Builder

wordpress 頁面構建器海狸

安裝並激活 Beaver Builder 後,當您將鼠標懸停在任何頁面上或在儀表板中發帖時,將出現一個新的 Beaver Builder 選項。

頁面或帖子

高級版

如果您將 Beaver Builder 升級到高級版或直接安裝高級版,則必須按照以下步驟操作。

  • 我的帳戶頁面下載您的 Beaver Builder 插件的 zip 文件。 您的許可證密鑰顯示在頁面上的 zip 文件鏈接上方。

我的賬戶

  • 導航到WordPress 儀表板 > 插件 > 添加新並點擊上傳插件

上傳插件

  • 單擊選擇文件按鈕,將出現瀏覽器窗口。

選擇文件

  • 從本地系統中選擇您的 Beaver Builder zip 文件,或者將文件拖到“瀏覽”按鈕的頂部。 zip 文件名將出現在“選擇文件”按鈕的右側。
  • 單擊立即安裝

現在安裝

  • 在激活插件之前,您必須了解場景。 如果您安裝了精簡版插件,則在安裝高級版時它會自動停用。 如果您已經安裝了高級版本,則可以通過單擊用上傳的替換當前來替換它。
  • 單擊激活以激活插件。

激活插件

插件激活

許可證激活

安裝並激活 Beaver Builder 插件後,我將向您解釋許可證激活過程:

  • 從 WordPress 儀表板,轉到設置 > Beaver Builder ,然後單擊許可證選項卡。
  • 添加您的許可證密鑰,您可以在“我的帳戶”頁面上找到該密鑰。
  • 當您的許可證處於活動狀態時,您可以獲得升級和降級。 許可證號應保持不變。

海狸生成器設置

輸入許可證密鑰

如何使用 Beaver Builder(實踐)

如何使用 Beaver Builder

安裝並激活後,當您將鼠標懸停在任何頁面上或在儀表板中發佈時,將出現一個新的 Beaver Builder 選項:

單擊它將打開該頁面並讓您訪問 Beaver Builder 編輯器。 您首先會注意到的是,您可以直接單擊頁面上的任何元素來訪問其所有設置。

在這些設置中,您可以使用拖放功能在頁面上移動項目、自定義該特定元素、模塊複製、列編輯或刪除元素的能力:

海狸生成器編輯器

在上面的例子中,我選擇了一個標題模塊。 如果我通過單擊扳手圖標來編輯該標題,則可以訪問如下所示的菜單:

標題模塊

儘管設置因您使用的模塊而異,但 Beaver Builder 插件始終將它們分為三大類:

  • 常規:這些是每個模塊的基本自定義選項。
  • 樣式:將樣式選項卡視為通過用戶友好界面將 CSS 應用於每個模塊的快速方法。
  • 高級:高級選項卡可讓您修改邊距、指定斷點、添加動畫、插入自定義 HTML 等。

更全面的模塊有額外的選項卡。 例如,顯示帖子或頁面的帖子模塊包括一個內容選項卡來過濾顯示哪些帖子,以及一個分頁選項卡來控制如何查看大量帖子。

理論上,您無需接觸 Beaver Builder 的高級自定義設置即可構建整個網站。 在此屏幕截圖中,邊距設置有一個桌面圖標,您可以根據需要切換為大、中和小屏幕設置不同的邊距值:

Beaver Builder 插件類別

雖然我使用了幾個 WordPress 頁面構建器工具,但 Beaver Builder 的學習曲線最簡單。 在其他頁面構建器從一開始就向您拋出數十個設置的地方,使用 Beaver Builder,您可以了解每個模塊的工作原理以及您可以用它做什麼。

就模塊選擇而言,Beaver Builder 包括 33 個元素。 其中,您具有菜單、聯繫表單、圖像、段落、標題等基本功能。

Beaver Builder 包含 33 個元素

但是,Beaver Builder 還包括更多“高級”選項,例如推薦模塊、圖標組、定價表和數字計數器。 定價表是任何電子商務網站的絕佳補充,因此我很高興地發現 Beaver Builder 使創建和自定義它們變得相對容易:

定價表

使用 Beaver Builder 自定義現有頁面很簡單,但從頭開始構建頁面相對簡單。 您可以將該過程分解為幾個簡單的步驟:

  1. 找出您想要的頁面粗略佈局。
  2. 開始添加列和行。
  3. 用您想要的模塊填寫列和行並自定義它們。
  4. 如果需要,可以拖動模塊以使元素看起來像您想要的那樣。
  5. 預覽頁面在各種屏幕尺寸上的外觀。

是的,這過於簡單化了。 然而,即使對於第一次使用 Beaver Builder 的人來說,整個過程也很直觀。

也就是說,重要的是要注意我確實有一些構建網站的經驗。 如果您不熟悉 WordPress 或組建您的第一個網站,您可能對使用 Beaver Builder 模板感興趣。

預建模板

正如我之前提到的,Beaver Builder 允許您從空白畫布或模板開始創建頁面。 開箱即用,它包括 30 多個登錄頁面模板和更多用於各種類型內容頁面的模板,以及 100 多個預構建行:

預建模板

儘管模板選擇範圍可能更廣,但 Beaver Build 包含現代設計,在任何網站上都不會顯得格格不入。 您可以選擇大英雄部分、動畫背景、圖標組、推薦部分、定價表等。

如果您沒有很多網頁設計經驗,模板是一種救命工具。 一旦掌握了插件的工作原理,您還可以使用 Beaver Builder 的模板系統來保存您自己的設計並將它們添加到其他頁面或項目中:

模板內容

模板是使 Beaver Builder 成為對初學者友好的頁面構建器的重要組成部分,因此我鼓勵您至少嘗試一些選項,如果您正在處理一個新項目。

Beaver Builder 與 Cloudways 的兼容性和性能

網站速度對您網站的成功起著至關重要的作用,並且可能是大多數網站所有者最關心的問題之一。 網站優化是必要的,但評估如何做到這一點可能很棘手。 對於這個 Beaver Builder 評論,我在 Cloudways 上測試了這個頁面構建器,看看它的性能如何,所以你沒有那些揮之不去的想法。

我將使用一些重要的速度測試工具,並向您展示 Beaver Builder 與 Cloudways 平台的兼容性。

我們使用的資源:

Cloudways服務器配置

姓名規格
雲道服務器Vultr – 高頻
數據中心位置西雅圖
內存2GB
固態硬盤64GB
帶寬傳輸2TB
處理器1 核
操作系統: Debian 9
NGINX 1.19
6.0.7
阿帕奇2.4.25
數據庫瑪麗亞數據庫 10.1
PHP 7.3

應用配置

姓名規格
WordPress 版本5.7.2
CDN 雲道CDN
安全證書讓我們加密
主題海狸生成器主題

已安裝的插件

插件名稱版本
微風版本 1.2.2
Cloudways 機器人保護版本 4.63

使用上述資源,我創建了一個網站來幫助您了解現場場景。 您可以從此鏈接查看網站。 現在,我將在不同的工具上測試該站點,以向您展示 Beaver Builder 與 Cloudways 的兼容性和性能。

GTMetrix 性能分析

網址:https://gtmetrix.com/reports/wordpress-626127-2033661.cloudwaysapps.com/9Y3cXpvz/
GTmetrix

  • 性能: 100%
  • 結構: 93%
  • LCP : 539ms
  • 待定時間:0ms
  • CLS : 0.03

Pingdom 性能分析

網址: https : //tools.pingdom.com/#5ea5673c8fc00000

Pingdom 性能分析

  • 性能等級:88
  • 頁面大小:2.0 MB
  • 加載時間:365ms
  • 請求數: 49

PageSpeed Insight 性能分析

PageSpeed 性能分析

總成績:91
FCP : 0.8s
速度指數: 1.5s
LCP : 1.8s
TTI : 0.8s
待定時間:0ms
CLS : 0.028

如您所見,我已經在三種不同的測試工具上測試了該站點,結果令人印象深刻。 Cloudways 為您提供帶有內置緩存插件的專用服務器的託管 WordPress 託管,並提供令人難以置信的性能。 部署使用 Beaver Builder 等頁面構建器構建的網站意味著您可以為用戶提供令人難以置信的體驗。

Beaver Builder:優點和缺點

我已經介紹了 Beaver Builder 提供的所有內容——它的功能、它的工作原理以及它的成本。 考慮到這一點,讓我們簡要回顧一下這個頁面構建器插件的優缺點。

優點:

  • 這是一個非常直觀的工具,即使您沒有使用頁面構建器的經驗。
  • 模板的選擇具有現代和多功能的設計。
  • 在頁面上添加和自定義元素很簡單,每個模塊都包含廣泛的設置和選項。
  • 列和行系統很簡單,適用於任何類型的網站。
  • 您可以保存模板和自定義模塊以在其他內容中重複使用它們。

缺點:

但是,雖然 Beaver Builder 非常棒,但它並非沒有缺陷。 例如,包含的模板設計精良,但選擇範圍可能要廣泛得多,因為許多 WordPress 新手可能會依賴這些模板來構建他們的網站。

另一個需要考慮的潛在缺點是插件的免費版本不包含很多模塊。 為了充分利用 Beaver Builder,您需要升級到付費計劃,這對個人網站用戶來說可能是一個無賴。

Beaver Builder 的不兼容性

Beaver Builder 與大多數與 WordPress 相關的東西兼容,但仍然存在一些缺點。 WordPress 是一個開源平台,所以用戶嘗試不同的主題和插件來檢查兼容性,有時他們成功,有時他們面臨不兼容。

讓我們來看看 Beaver Builder 的一些主要不兼容性。

  1. 插件衝突

當您遇到 Beaver Builder 編輯器的任何問題時,它通常是由於另一個插件衝突而發生的。 緩存插件可能是衝突的原因。 如果是這樣,請在遇到任何問題時清除緩存插件並停用除 Beaver Builder 之外的所有插件。 一一啟用每個插件並在每個插件之後測試 Beaver Builder。 重複此過程,直到找到導致問題的插件。

2. 主題衝突
主題也可能導致 Beaver Builder WordPress 插件出現問題。 由於主題而出現的問題是什麼,我們如何識別它們?

讓我們檢查以下幾點以便更好地理解:

  • 頁面在編輯過程中或保存編輯頁面時掛起
  • 用戶無法在 Beaver Builder 中編輯頁面
  • Beaver Builder 編輯欄未出現在頁面頂部
  • 模塊設置框不會出現在編輯器中

轉到WordPress Dashboard > Appearance > Theme ,然後將您的活動主題切換到任何 WordPress 標準主題,例如二十二十。

3.異步Javascript插件

除非您配置以下設置,否則異步 Javascript 插件可能會發生衝突並導致問題。

  • 排除 jQuery
  • wp-includes/js 被添加到 Async Javascript > Settings > Scripts Exclusion字段。

4. 複製插件

不建議使用任何復制器插件來克隆頁面和保存佈局。 您可能會發現它正在運行,但是當您在新頁面上編輯 Beaver Builder 佈局時,它會導致問題。 取而代之的是,您可以使用 Beaver Builder Tools 菜單中的 Duplicator Layout。

5. Cloudflare 的 Rocket Loader

Cloudflare 的 Rocket Loader 可能會在編輯頁面時導致 Beaver Builder 出現問題,因此建議在編輯期間將其關閉。 您可以在完成網站後打開它。

Cloudways 用戶對 Beaver Builder 的評論

口耳相傳比營銷技巧更響亮,所以讓我們看看 Beaver Builder 社區並分析人們對 Cloudways 的看法。 現在是時候探索人們如何在使用 Beaver Builder 時將 Cloudways 視為最佳平台。

客戶的反饋意見

回饋

大衛·R

斯科特戴維森

可以肯定地說,Cloudways 是您打算使用 Beaver Builder 構建的下一個網站的最佳選擇之一。

關於 Beaver Builder 的最終想法

在徹底測試了 Beaver Builder WordPress 插件後,我可以自信地說,它是開始構建非凡 WordPress 網站的最佳解決方案之一。

該插件具有大量功能,並且足夠靈活,可以讓您的設計盡可能具有創意。 最重要的是,它非常易於使用。 這幾乎就像玩樂高:你在你的網站上挑選你想要的元素,然後把它們放在你想要的地方。 繼續這樣做(但如果您願意,您可以在高級設置中使用所有專業版),同時生成的網站就在您面前。 簡而言之,您可以在製作時看到網站上的所有更改,使過程非常直觀,而且我敢說,很有趣。

在 Cloudways Managed Hosting 上測試插件的性能後,我可以肯定地說,如果您想快速部署網站但又不想在其性能或安全性等方面妥協,則需要在 Cloudways 上使用 WordPress 服務器+ Beaver Builder 插件,這是成功的必經之路。

閱讀此評論後,您對 Beaver Builder 有何看法? 如果我們可能遺漏了任何一點,請告訴我,我會確保更新此評論。

問:Beaver Builder 是免費的嗎?

是的。 Beaver Builder 的基本版本是免費的,但您可以升級到 Beaver Builder Pro 版本以獲得附加功能和選項。

問:Beaver Builder 對 SEO 有好處嗎?

Beaver Builder 使用最好的 SEO 標準,例如代碼壓縮和 schema.org 等,以確保您創建的頁面在搜索引擎中很容易找到。

問:Beaver Builder 主題是什麼?

Beaver Builder Theme 是一個適用於 WordPress 項目的適應性框架。

問:哪個主題最適合 Beaver Builder?

Beaver Builder 適用於大多數主題。