Visual Composer 与 Beaver Builder

我们对所有主要的 WordPress 拖放页面构建器的比较被证明非常受欢迎。 文章重点介绍了免费和高级拖放页面构建解决方案的最佳功能。

我毫不怀疑您会发现比较文章很有用，但是我们认为我们会将两个 WordPress 社区最喜欢的页面构建器放在一起，并更详细地检查他们的优缺点。

Visual Composer 是 WordPress 插件，它真正定义了拖放页面构建器，并且仍然是 WordPress 最畅销的拖放页面构建器。 Beaver Builder 是一种较新的解决方案，自 2014 年推出以来不断发展壮大，今年真正声名鹊起。

这些出色的解决方案如何比较？ 让我们仔细看看。

视觉作曲家

Visual Composer 不仅是 CodeCanyon 上最畅销的 WordPress 插件，它还包含在 ThemeForest 上的大量 WordPress 主题中。 这有助于解释为什么该插件被用于超过 500,000 个网站。

Visual Composer 使用用户友好的界面帮助您在几分钟内构建响应式布局。 它允许您在网站的后端或前端创建布局。 它适用于任何 WordPress 主题，并支持 WordPress Multisite 和 WooCommerce。

该插件包含十多个语言包，并支持 WordPress 多语言插件。 大量的内容元素和预定义的布局也与插件一起打包。

Visual Composer 与所有可用的自定义帖子类型兼容。 这意味着您可以使用它来修改通过 WordPress 主题和插件添加的任何博客文章、页面和自定义文章类型。

Visual Composer 最酷的功能之一就是它的灵活性。 插件中有很多开发人员选项，CodeCanyon 上有超过一百个插件可供使用。

我是第一批测试和审查 Visual Composer 的人之一，自推出以来，他们每年都添加更多特性和功能。

使用可视化作曲家

安装 Visual Composer 后，您将在编辑屏幕中看到一个新的 Visual Composer 栏。 一个加载后端编辑器，另一个加载前端编辑器（即使您禁用了 WordPress 可视化编辑器也会显示此栏）。

当您加载后端编辑器时，您的内容区域将转换为用于构建页面的画布。 一个名为“经典模式”的按钮取代了您之前单击的后端编辑器按钮，并帮助您返回到默认的 WordPress 编辑模式。

界面顶部有五个按钮：左侧三个，右侧两个。

在左侧，Visual Composer 图标将您带到官方插件网站，加号可让您向页面添加元素，T 图标打开模板框。 右侧有一个配置图标，打开一个用于添加自定义 CSS 代码的框和一个用于切换到前端编辑器的按钮。

如果您尚未添加任何内容，您将看到有关如何快速添加内容的说明。 您可以选择添加元素、添加文本块或选择其中一种预定义布局。 例如，您可以通过单击按钮添加登录页面或产品页面。

在我的 WordPress 拖放页面构建器比较文章中，我注意到内容模块有很多名称。 一些开发人员称它们为模块，一些人称它们为块，另一些人称它们为小部件。 Visual Composer 称它们为元素。 它们都指帮助您构建布局的小块内容。

可用元素的数量令人印象深刻。 当前版本的 Visual Composer 总共提供了 48 个内容元素（这个数字包括默认的 WordPress 小部件）。 七个较旧的已弃用内容元素也可用，并且可以通过使用插件扩展添加其他内容元素。

您可以使用这些元素创建复杂的页面。 您可以添加图表、图片库、视频、地图、帖子网格、图标、社交媒体共享按钮等。

添加内容元素，然后将它们放入行和列中很简单。 可以将行和元素拖动到您想要放置它们的位置。 一行中显示的列数可以通过选择十一个列结构之一来确定，例如 2/3 + 1/3。 或者，您可以创建自己的自定义结构。

有删除元素、列和行的选项。 通过选择加号可以将新元素添加到列和行。 您还可以克隆整行内容。

许多设置可用于列和行。

在常规选项卡中，有使用视频背景、拉伸行/列和添加自定义 CSS 的选项。 设计选项卡允许您以任何您希望的方式设置列或行的样式。 您可以定义边距、边框、填充和颜色。

单个元素的可用设置取决于正在修改的元素。 Facebook like 按钮等基本元素仅允许您选择按钮类型，而更复杂的元素可能有数十种不同的选项。

您创建的任何布局都可以保存为模板并应用于您网站上的其他页面。 提供了 44 种默认的预制布局来帮助您入门。 这包括常见问题解答模板、帮助模板、服务模板和关于页面的多个模板。

您可以通过单击帖子/页面编辑器中的前端按钮来激活前端编辑器。 如果您登录到您的网站，您还将在每个页面顶部的 WordPress 管理栏中看到“使用 Visual Composer 编辑”链接。 单击此链接将加载前端编辑器以供您编辑该页面。

后端和前端编辑器的工作方式类似。 您将在页面顶部看到相同的按钮来添加元素并打开模板框。 在右侧，您将看到一个返回后端编辑器的按钮和一个用于保存所做更改的更新按钮。

指南按钮允许您修改页面。 您可以在后端编辑器中做所有可以做的事情，例如编辑元素和移动列和行。

单击屏幕图标可让您将视图从桌面模式更改为平板电脑和智能手机的横向和纵向模式。 这对于查看您的页面在移动设备上的外观非常有用。

我一直发现 Visual Composer 的后端编辑器比前端编辑器更容易使用。 我可以使用后端编辑器在几分钟内构建专业的设计，但使用前端编辑器，我觉得移动东西更笨重，更不流畅。 它仍然像它应该的那样工作，但它对我来说并不像用户友好。

但是，我从其他 Visual Composer 用户的评论中知道，许多人更喜欢使用前端编辑器而不是后端编辑器，所以这可能是您习惯使用哪个界面的问题（前端编辑器是在 Visual Composer 中引入的很久以后所以我对后端编辑器有更多的经验）。

视觉作曲家设置

Visual Composer 设置区域允许您修改许多不同的功能和选项。

在常规设置页面中，您可以定义 Visual Composer 将在哪些类型的帖子类型上处于活动状态。 通过您的主题或插件添加的任何其他自定义帖子类型都将在此处列出。 您还可以禁用响应式内容元素并启用 Google 字体子集。

此页面的中心部分允许您控制每个 WordPress 用户组对 Visual Composer 的访问。 您可以定义用户组是否看到 Visual Composer，他们是否看到 Visual Composer 和默认编辑器，以及他们是否只看到 Visual Composer（即禁用默认编辑器）。

在设计选项页面上，您可以更改内容元素的默认颜色。 您还可以修改元素底部的边距、列间距和移动屏幕宽度。

无需修改核心插件文件即可添加自定义 CSS 代码。

购买 Visual Composer 时会提供产品许可证。 它适用于一个网站，并确保通过您的管理区域获得持续支持和自动更新。

第三方插件提供的简码可以映射到 Visual Composer 内容元素。

在关于页面有一个欢迎页面，通知您插件的最新添加。 还有一个常见问题页面，其中包含指向许多优秀教程的链接，以及一个链接到知识库、视频学院和开发人员社交媒体帐户的资源页面。

高级网格生成器

Visual Composer 允许您为以下内容元素添加新的网格元素：后网格、后砌体网格、媒体网格和砌体媒体网格。 这些是可用于在您的网站上显示博客文章、画廊和其他内容的内容元素。

下面的视频将引导您准确了解网格构建器的工作原理。 我建议您观看它以更好地了解它们是如何组合在一起的，因为当您第一次访问网格构建器页面时，尚不清楚它如何为您提供帮助。

视觉作曲家定价

Visual Composer 的零售价仅为 34 美元。 没有每年的续订费用。 购买插件后，您可以无限期地获得支持和更新。

请注意，为了获得支持和自动更新的资格，您需要在设置区域中输入您的许可证密钥。

从技术上讲，Visual Composer 不是 GPL 友好的。 尽管 WordPress 不允许限制使用，但开发人员要求所有客户为他们使用 Visual Composer 的每个网站购买常规许可证。

值得庆幸的是，无需输入您的许可证密钥，该插件仍然可以正常运行。 因此，没有什么能阻止您在您拥有的每个网站上使用该插件。

海狸生成器拖放页面生成器

与 Visual Composer 一样，Beaver Builder 可帮助您使用拖放界面轻松构建专业页面。 这两种解决方案之间最大的区别之一是使用 Beaver Builder 进行的所有编辑都在您网站的前端进行。

所有布局都是响应式的，可视化编辑器与博客文章、页面和所有其他自定义文章类型兼容。 由于支持短代码和小部件，Beaver Builder 可以与大多数其他 WordPress 插件配合使用。 例如，您可以轻松地将来自其他插件的项目集成到您的布局中，例如表单、表格和画廊。

Beaver 对 WooCommerce 和 WordPress 多语言插件有很好的支持，几乎可以与任何 WordPress 主题一起使用。 它还支持 WordPress Multisite，但不幸的是，此功能不包含在 Beaver Builder 的标准许可证中（稍后将详细介绍定价选项）。

Beaver Builder 对我来说真正突出的特点是它的页面模板系统。 它允许您在几秒钟内创建大型详细页面。 您所要做的就是选择您想要的页面模板。 例如，您可以通过单击按钮创建业务联系页面。

Beaver Builder 价格较高的许可证还与 Beaver Builder WordPress 主题一起打包。

使用海狸生成器

Beaver Builder 与 WordPress 的集成方式与 Visual Composer 非常相似。 激活插件后，您可以通过单击帖子编辑器中的“页面构建器”选项卡来加载编辑器。

或者，如果您已登录，则可以单击每个页面顶部 WordPress 管理栏中的“页面构建器”链接。

首次激活页面构建器时，将显示一个显示布局模板的叠加层。 顾名思义，主页模板旨在用于您网站的主页。

提供十四个独特的主页布局模板。 或者，您可以选择使用空白页。

内容布局模板可帮助您快速构建常用页面。 例如，您的关于页面、联系页面和博客页面都有布局。

总共有 13 个内容模板可供选择。 当然，您可以将手动创建的任何页面保存为模板，并在您网站的其他地方使用。

Beaver Builder 具有易于理解的用户友好界面。

在管理栏中，右上角有链接：模板、工具、完成和帮助图标。 右侧是用于行布局、基本模块、高级模块和 WordPress 小部件的下拉菜单。

模板按钮加载我之前突出显示的布局模板框。

单击工具框会显示一些选项。 复制页面将生成具有相同布局的帖子/页面/帖子类型的副本。 还有一个选项可以将您的布局另存为模板。

选择“编辑全局设置”将加载“页面构建器设置”框。 您可以在此处修改默认页面标题、行、模块和响应式布局的设置。

单击完成按钮可让您发布所做的更改或将其保存为草稿。 如果您选择放弃更改，您所做的所有修改都将丢失，页面将恢复为上次保存的版本。

帮助图标提供了进行交互式导览、观看 7 分钟教程视频以及跳转到 Beaver Builder 知识库或论坛的选项。

我建议您在第一次加载 Beaver Builder 时进行参观。 它会给你一个很好的概述一切是如何工作的。

右侧菜单中的第一个选项是行布局。 您可以选择拥有一到六列内容。 也可以添加左右侧边栏。

您所要做的就是选择您想要的列或侧边栏，然后将其拖到内容区域中。 它真的很好用。

您可以删除、复制或移动行。 您还可以修改行设置。

删除一列将自动减少该特定行中的行数。 例如，将其从三列减少到两列等。

相同的设置可用于行和列。 您可以调整宽度、文本、从背景颜色更改为背景照片、修改背景设置以及定义边框。 在高级选项卡中，您可以修改边距和填充、响应式布局和 CSS 选择器。

单击保存按钮后，您将立即保存更改。 我发现一切都很完美。 例如，默认情况下，两列行的宽度各为 50%，但如果将其中一列的宽度调整为 70%，另一列将自动更改为 30% 的宽度。

有五个基本内容模块：标题、照片、分隔符、文本编辑器和视频。

正如您所期望的那样，您只需将内容模块拖放到您的页面中所需的列和行中。 完成此操作后，您可以修改该内容模块的设置。 就像 Visual Composer 一样，显示的设置取决于您正在修改的内容模块。

添加第一个内容模块后，您可能会有些困惑，因为页面右侧的菜单消失了。 要使菜单返回，您需要单击页面顶部的“添加内容”按钮。

有 22 个高级模块可用。 这包括发布手风琴、滑块、定价表和订阅表格。

十二个默认的 WordPress 小部件也可用。 这使内容模块的总数达到了三十九个。

创建页面后，您应该保存草稿或发布页面。 我还建议您将布局保存为模板。

海狸生成器主题

Beaver Builder 主题包含在 Beaver Builder 的专业版和代理版中（稍后会详细介绍定价计划）。 主题本质上是一块空白画布，可让您创建所需的网站。

在过去几年中，WordPress 一直在鼓励主题开发人员将 WordPress 主题定制器集成到他们的设计中。 采用率一直很慢，大多数主题开发人员仍在使用自己的主题设置页面。

但是，Beaver Builder 主题的开发人员已经接受了主题定制器。 每个主题选项和设置都可以在那里找到。 这与 Beaver Builder WordPress 插件很好地联系在一起，因为这意味着您对网站所做的所有更改都可以实时预览。

有大量可用的配置选项。 您可以修改页眉、页脚、小部件、颜色等。 还包括一个导入和导出工具。

我对提供的选项数量感到满意，并发现更改颜色、背景和字体非常容易。

很明显，Beaver Builder 主题是为插件用户构建的，因为主题本身非常基础。 它允许您自定义设计的大量设置，但更改网站结构的选项很少。 在这方面，我觉得这个主题过时了。

但是，有十种不同的主题预设可用。 这些预设将改变您网站的配色方案。

虽然 Beaver Builder 主题是一个不错的补充，但它缺乏大多数现代 WordPress 主题提供的功能和附加功能。 对于 Beaver Builder 为这个主题想要的额外资金，你最好购买一个一体化的 WordPress 主题，比如 Divi，因为它提供了更多。

页面构建器设置

Beaver Builder 插件的设置区域显示在一页上。 菜单中显示十个部分。

第一部分是输入许可证密钥以接收远程更新和支持的选项。 如果您不输入密钥，该插件仍将正常运行。

可以从模块部分禁用所有基本和高级模块。

您也可以禁用 WordPress 小部件以供选择，但是没有选项可以单独禁用小部件。

在模板部分，您可以启用所有模板、仅启用核心模板、启用用户模板（即您保存的模板）以及禁用所有模板。

还有一些选项可以在管理区域中编辑页面构建器模板并覆盖核心模板。

您的 WordPress 网站上可用的所有帖子类型都显示在帖子类型部分。 您可以禁用任何您不希望 Beaver Builder 处于活动状态的帖子类型。

该插件包含三个不同的图标集。 这些可以在图标部分禁用。 还有一个选项可以上传您自己的图标集。

在编辑部分，您可以定义编辑 Beaver Builder 所需的 WordPress 功能级别。

白标适用于购买 Beaver Builder 代理许可证的人。 您可以输入自己的品牌并定义自己的公司图标。

我之前谈到了当您单击页面构建器中的帮助图标时会发生什么。 如果您愿意，可以禁用此图标。 或者，您可以禁用单个项目。 也可以定义帮助视频、知识库和论坛的 URL。

如果您已将网站转移到新的托管计划，则可能需要清除插件的缓存。

我很高兴看到 Beaver Builder 包含一个卸载选项。 单击卸载按钮将删除插件及其相关的所有数据。

如您所见，Beaver Builder 在设置页面上有很多有用的选项可供配置。 我认为它真正需要的一件事是能够根据用户角色修改权限（这是 Visual Composer 所拥有的）。

海狸生成器定价

Beaver Builder 的开发人员采用了三种不同许可选项的流行定价策略。 选项包括标准、专业和代理。

所有许可证都允许您在无限数量的网站上使用 Beaver Builder，只要您愿意。 提供一年的支持和更新，随后的几年以原价的 40% 的折扣价提供（但如果您不续订，您可以继续使用该插件）。

支持团队还将帮助您为您的网站创建自定义模块。

Beaver Builder 的标准许可证零售价为 99 美元。 此许可证提供 Beaver Builder 插件的完整副本，但不包括 Beaver Builder WordPress 主题或对 WordPress Multisite 的支持。 要获得这两个附加功能，您需要升级到价格为 199 美元的专业许可证。

最昂贵的许可证是代理。 零售价为 399 美元。 它提供了专业许可证所做的一切，还提供了白标功能。 您可以将所有对 Beaver Builder 的引用替换为您自己的公司名称，并且可以修改 Beaver Builder 的核心页面模板。

除非您需要对 WordPress Multisite 的支持，否则我相信 99 美元的标准许可证可以为您提供所需的一切，因为 Beaver Builder 主题不值得多付 100 美元。

Visual Composer vs Beaver Builder：总结

如您所见，Visual Composer 和 Beaver Builder 各有优缺点。 就创建布局而言，我个人认为这两种解决方案之间没有太多区别，因为两者都可以用来创建美观的网站。

如果您更喜欢在网站的前端创建布局，我相信 Beaver Builder 会稍微边缘化它，因为界面更加流畅（尽管它们之间没有很大的数量）。

如果您喜欢在网站的后端创建布局，Visual Composer 是您的最佳选择，因为 Beaver Builder 不提供此功能。

在使用这两种解决方案创建布局后，我得出的结论是，我更喜欢使用 Visual Composer 在后端创建布局。 这可能部分是因为我对插件有更多的经验，但我觉得我可以使用 Visual Composer 更快地创建我想要的页面。 但是，我相信这真的取决于您自己喜欢哪种界面，因为尽管 Beaver Builder 可能看起来不专业，但我发现它简单的界面使用起来很愉快。

为了帮助您做出决定，让我们快速回顾一下这两个插件的优缺点。

视觉作曲家专业人士

• 比 Beaver Builder 便宜很多
• 让您在网站的后端和前端创建布局
• 提供更广泛的内容模块
• 提供许多开发人员选项，并且有大量可用的 WordPress 插件可以添加额外的功能

视觉作曲家缺点

• 该插件不是 GPL 友好的，开发人员希望您为您拥有的每个网站购买 Visual Composer 的许可证（尽管从技术上讲，无论如何您都可以在多个网站上使用该插件）
• 前端编辑器可以更精致一些

海狸生成器优点

• 具有易于理解的用户友好界面
• 可以在无限数量的网站上使用
• 有各种各样的内容模块和小部件

海狸生成器缺点

• 比 Visual Composer 贵
• 您只能在网站前端编辑布局
• 价格较高的专业和代理许可证不能证明其额外成本是合理的（特别是多站点支持是 Visual Composer 的标准配置）

我希望您发现这篇比较文章很有用。 要了解有关这些 WordPress 插件的更多信息，请访问 Visual Composer 和 Beaver Builder 的信息页面。

谢谢阅读。

凯文