Elementor Pro 与 Beaver Builder 2022

WordPress 社区拥有许多拖放页面构建器。 即使您没有设计或开发经验，这些用户友好的 WordPress 插件也可以让您在几秒钟内创建具有专业外观的页面。

在本文中，我们将两个最流行的 WordPress 拖放页面构建器相互竞争：Elementor Pro 和 Beaver Builder。

这两种解决方案都使用前端编辑器。 这意味着您可以使用可视化编辑器直接在您的网站上进行更改并实时查看更改。

让我们深入研究一下 Elementor Pro 和 Beaver Builder 为 WordPress 网站所有者提供了什么。 这将帮助您了解哪些高级拖放页面构建器适合您。

元素专业版

Elementor 在 2016 年 6 月首次发布时立即受到欢迎。该插件在短短三个月内就获得了超过 10,000 次激活安装，而 15 个月后，开发人员已成功地将其用户群从 10,000 增加到 300,000 多个用户。

Elementor 免费版增长如此迅速的原因之一是，开发人员提供了用户友好的体验，其功能通常只能在高级拖放页面构建器中找到。 他们的专业版（我们今天将在本文中介绍）解锁了 Elementor 的所有功能。

Elementor 使用漂亮的前端可视化编辑器让您完全控制网站上的每个页面。

多达 90 个内容小部件可帮助您按照自己的方式塑造页面。 您将找到用于添加图像、视频、地图、侧边栏、推荐等的小部件。

这些内容小部件中的 50 多个仅在专业版中可用。 这包括 WooCommerce、社交媒体共享、定价表、帖子、投资组合、Facebook 评论等所需的内容小部件。

您会很高兴听到您可以将任何 WordPress 小部件与 Elementor 一起使用。 这为集成您最喜欢的 WordPress 插件中的小部件提供了无限的机会。

Elementor 的各个方面都是开源的、对移动设备友好的，并且针对搜索引擎进行了优化。 还提供了大量预制模板。 这些可以原封不动地使用，也可以作为创建您自己设计的基础。 所有模板都可以保存并应用于其他页面。 它们也可以导出和导入。

使用 Elementor Pro

激活 Elementor 后，您将在帖子和页面列表页面中看到“使用 Elementor 编辑”链接。 您可以通过单击此链接直接跳转到实时编辑器。

如果您已经在帖子或页面编辑区域，只需单击“使用 Elementor 编辑”按钮。 在 WordPress 块编辑器中，您也会在每个页面的顶部看到该按钮。

使用 WordPress 经典编辑器时，“使用 Elementor 编辑”按钮显示在可视化编辑器上方。

Elementor 界面在页面左侧显示所有选项。 当您单击主要内容区域时，您可以移动部分和小部件。

Elementor 将内容小部件称为元素，尽管令人困惑的是，搜索栏在面板顶部显示“搜索小部件”。 所有元素都显示在两列中。

顶部是基本元素，例如文本、标题、图像、视频和地图。 下一部分显示所有专业元素，然后是一般元素和 WordPress 小部件的部分。 大量元素意味着您需要使用滚动条进行导航。

要将内容添加到您的页面，只需单击内容元素并将其拖到您的页面。 当您单击页面上的内容元素时，左侧的面板将更改为显示该元素的设置。 设置分为三个部分：内容、样式和高级。

您可以更改内容元素的各个方面——布局、样式、颜色等等。 由于 Elementor 使用可视化编辑器，您可以实时查看所做的任何更改。

面板的最顶部是 Elementor 徽标和左右两个按钮。

左侧的按钮会弹出一个设置框，您可以在其中访问站点设置、主题构建器和用户首选项。

右侧的按钮用作重置按钮。 单击它将带您回到显示所有内容元素的主面板。

在站点设置区域中可以找到数百个选项。 有修改全局颜色和字体、排版、按钮、布局等的选项。

在面板底部，您可以将视图从桌面模式更改为平板电脑和移动模式。 您还可以访问您的更改历史记录并恢复到以前版本的布局。 如果您犯了错误或只是改变了对您添加的内容的想法，这将很有用。

此菜单中的模板按钮可让您将当前布局保存为模板并访问模板库。

Elementor 的界面不像 Beaver Builder 那样直观，但是一旦你知道它是如何工作的，你就可以在几分钟内创建专业的布局。

Elementor 的预先设计的模板

当您有一个空白页面时，您将看到一个添加新部分或模板的选项。 添加内容后，此区域将继续显示在页面底部。

添加新部分可让您选择十二个列结构之一。 单击“添加模板”按钮加载模板库。 如前所述，这也可以通过主选项面板底部的菜单启动。

模板库显示所有预先设计的模板以及您自己创建和保存的所有模板。 还有一个选项可以将您当前的布局保存在右上角。

Elementor 中提供了大约 350 个预先设计的模板。 这些布局中的绝大多数仅适用于 Elementor Pro 用户，其中大约 30 种可供免费用户使用。 除了完整的模板布局，您还可以添加预先设计的内容块。 这对于添加页面的某些部分很有用，例如内容表单、常见问题框或推荐。

可以预览每个模板，然后将其插入您的内容区域。 单击插入后，在将其添加到您的页面之前，总会有几秒钟的轻微延迟。

您会找到许多不同领域的页面模板。 有咖啡店、律师事务所、体育网站、节日、房地产公司、即将推出的页面、关于页面、在线商店等的模板。

令人讨厌的是，Elementor 没有为您提供替换当前布局的选项。 它始终附加在现有布局的末尾。

因此，如果您插入一个布局并且您不喜欢它，您需要转到主面板中的设置区域并选择“删除所有内容”。 如果您忘记执行此操作然后添加新布局，则需要返回并手动删除之前插入的布局的所有部分，或者删除所有内容并再次插入布局。

重要的是要记住，所有拖放页面构建器都旨在帮助您修改主要内容区域。 因此，如果您的页面上有侧边栏，则模板看起来会全部挤在一起。

Elementor 在页面设置下有一个有用的选项，可让您从主题的常规模板更改为空白画布或全角模板。 这将清除布局并让您以预期的方式发布它（即没有侧边栏）。

模板是 Elementor 的一大卖点。 预先设计的模板是您自己布局的良好起点。 通过玩弄这些设计，您可以更好地了解如何充分利用插件。

超越内容领域

无论您是从头开始创建布局还是自定义现有布局，您都可以将其保存为模板并反复使用。 在您的网站上创建内容时，这非常有用。

您还可以使用 Elementor Theme Builder 创建完整的网站设计。 它可用于创建完整的页面、部分、页眉、页脚、帖子等。

所有主题构建器布局都是通过 Elementor 用户界面创建的。 对于每个布局，您可以定义它在什么条件下显示或从您的网站中排除。

这有助于您在整个网站上创建独特的布局。 例如，您可以设置条件以对每个博客文章类别使用不同的页眉和页脚。

为了充分利用主题构建器，我建议使用 Elementor Hello Theme。 您可以从 WordPress.org 或您的管理区域免费下载。

这个极简主义的 WordPress 主题充当空白画布，使构建登录页面和整页设计变得更加容易。 这是一个轻量级的解决方案，不会与任何 WordPress 插件冲突。

Hello 在定制器中只有几个简单的设计选项，因为开发人员希望所有网站定制都发生在 Elementor 编辑器中。

一旦您熟悉了在 Elementor 中创建漂亮的博客文章和页面，我鼓励您探索 Elementor 主题构建器。 这是一项了不起的功能，可让您完全控制网站上每个页面的结构和样式。

Elementor Pro 设置

在 Elementor 的主要设置区域中，您可以选择可以使用的帖子类型。 样式设置已转移到 Elementor 主编辑器，但仍然可以在高级设置页面上找到一些样式设置。

您可以在集成设置页面上输入您用于 Facebook、MailChimp 和其他第三方服务的 reCAPTCHA 密钥和 API 密钥。

Elementor 支持自定义字体和图标。 还可以使用角色管理器，让您定义哪些 WordPress 用户组可以访问编辑器，哪些只能编辑内容。

您的模板库链接在主设置 WordPress 菜单中。 这使您可以轻松查看已创建和保存的布局。 系统和许可证信息也可以在这里查看。

工具区域可帮助您执行许多杂项任务，例如重新生成 CSS、替换您的网站 URL 以及回滚到 Elementor 的先前版本。

该区域还有一个用于替换 WordPress 数据库中的 URL 的工具、一个回滚到该插件以前版本的选项，以及另一个将您的网站置于即将推出或维护模式的选项。

设置区域的布局方式有点奇怪。 有一个设置区域和一个工具区域，每个区域有四个不同的部分。 在几个选项卡中列出所有选项的单个设置页面会更有意义。

如果 Elementor 可以免费下载，为什么要升级？

Elementor 的免费版本确实令人印象深刻，它包含大量的内容小部件和模板以及导出和导入等基本功能。 因此，您可能想知道，如果免费版不错，为什么会有人想要购买专业版。 这是一个合理的问题。

答案很简单。 虽然 Elementor 的普通版很好，但专业版很棒。

Elementor Pro 中包含的 50 多个内容小部件（元素）包含对在线商店必不可少的 WooCommerce 小部件、帮助发布博客文章的帖子小部件、幻灯片小部件、定价小部件、登录小部件和许多社交媒体小部件。 大多数预先设计的模板也仅在 Elementor Pro 中可用。

其他高级功能包括使小部件全局化并将其部署到整个网站的能力、实时 CSS 以及将模板作为小部件直接集成到网站侧边栏的选项。

我们也不要忘记令人惊叹的 Elementor Theme Builder。

我认为说 Elementor 的免费版本具有限制性是不公平的，因为它不是。 但是，我相信使用免费版的网站所有者会羡慕专业用户获得的高级功能。

查看免费版和专业版之间的差异列表，以准确了解升级后收到的内容。

Elementor Pro 定价

对于想要从免费版本升级的用户，Elementor 有一个简单而公平的定价政策。

提供三种不同的高级计划：个人、Plus 和专家。 所有计划都提供相同版本的 Elementor Pro。 唯一的区别是您收到了多少网站的更新和支持。

每年 49 美元是升级到 Elementor 专业版的诱人价格。 如果您想要三个网站许可证，只需 99 美元，如果您想要 1,000 个网站许可证，只需 199 美元。

所有 WordPress 用户都可以安装 Elementor 的免费版本，以熟悉该插件能做什么和不能做什么。 尽管如此，Elementor Pro 仍然提供 30 天退款保证。

过去，Elementor 为客户提供许可证续订折扣，但他们似乎不再提供此优惠。

海狸生成器

Beaver Builder 于 2014 年 4 月推出，始终提供易于使用的界面和一系列高级功能，使创建专业内容变得简单。 事实证明，该插件在开发人员中也非常受欢迎，这就是为什么 Beaver Builder 受到如此高的重视以及他们拥有超过 50 万客户的原因。

与 Elementor 一样，Beaver Builder 允许您使用前端可视化编辑器自定义您的网站。 该插件的免费版本可用（稍后会详细介绍），但它是每个人都熟悉的高级版本。

Beaver Builder 使用极简界面，非常适合默认的 WordPress 配色方案。 刚推出时，我批评 Beaver Builder 看起来过时了，但 2017 年 Beaver Builder 2.0 Hoover 的发布改变了这种看法。 界面现在看起来温暖而现代。

Beaver Builder 一直擅长的地​​方是可用性。 从第一天开始，Beaver Builder 就提供了其他拖放页面构建器试图匹配的用户友好体验。 该界面加载速度快，几乎没有学习曲线。

提供了 35 个独特的内容小部件，它们称为模块，您还可以使用默认和第三方 WordPress 小部件。 内容模块全部分类以帮助您快速找到它们。 有十个基本模块、九个媒体模块、七个动作模块、四个布局模块、两个信息模块和三个帖子模块。

所有布局都可以保存并应用于其他页面，并且有数十个预制的登陆和内容页面可供选择。

Beaver Builder 的高价许可证中包含一个名为 Beaver Builder Theme 的框架。

使用海狸生成器

Beaver Builder 中的所有编辑都在您网站的前端进行。 您可以通过单击帖子和页面列表页面中的“Beaver Builder”链接来启动页面构建器。

默认情况下，如果您选择创建新的博客文章或页面，将使用 WordPress 块编辑器，但是您会看到“转换为 Beaver Builder”的选项。

可以使用块编辑器设置列表中的转换工具将现有内容转换为使用 Beaver Builder 进行编辑。 然后，您将看到一个启动 Beaver Builder 界面的选项。

Beaver Builder 也可以从经典编辑器启动。

如果您在浏览您的网站时已登录，您还会在每个页面的顶部看到一个使用 Beaver Builder 编辑布局的选项。

Beaver Builder 界面非常易于导航，并且加载速度很快。 我已经测试了几十个 WordPress 页面构建器，而 Beaver Builder 总是能最快地加载布局、框和设置。

首次启动页面构建器时，您将在页面顶部看到一个简单的工具栏。

在左侧，您将看到当前正在编辑的帖子或页面的注释。 在右侧，您将看到一个加号 (+) 和一个名为“完成”的按钮。 单击“完成”按钮会弹出用于放弃更改、将更改保存为草稿、发布页面或取消更改的按钮。

单击加号会加载主页构建面板。

默认情况下显示标准内容模块，但您可以切换以显示 WordPress 小部件或保存的模块（提醒：模块、元素和小部件都是相同的东西）。

如前所述，内容模块分为以下类别：基本、媒体、操作、布局、信息和帖子。 它们都很容易访问。

所有常用的选项都在那里。 您可以复制、编辑、删除和移动列、行和内容模块。

当您编辑列、行或内容模块时，会出现一个框，其中包含许多不同的自定义设置和样式选项。 一般来说，我会说 Elementor 在这里提供了更多的自定义选项，但是使用 Beaver Builder，添加颜色和更改整体布局和样式很简单。

如果我们返回主面板，我们可以看到有四个不同的选项卡：Modules、Rows、Templates 和 Saved。

行选项卡具有具有不同列变化的预制行结构。 您只需将它们拖到您的内容区域，然后将内容添加到列中。 此处还提供了预制行，以帮助您更快地构建页面。

最后，您可以在已保存选项卡中查看已保存的行和模块。 也可以从行选项卡访问已保存的行。

模板选项卡分为三个不同的部分，可以通过下拉菜单访问。 这些部分是登录页面、内容页面和保存的模板。

有一个空白画布模板、30 个登录页面模板和 30 个内容模板。

尽管 Beaver Builder 提供的模板少于 Elementor Pro，但它们的设计组合更好。 Elementor Pro 中提供的一些模板非常晦涩难懂。 Beaver Builder 中的那些看起来适合更多的网站所有者。

代理机构、企业、营销人员和在线商店有多种布局。 您还将找到关于页面、服务页面、投资组合、联系页面等的页面模板。

遗憾的是，没有预览任何模板的选项或快速删除网站设计侧边栏的方法。 但积极的一面是，当您单击模板时，您可以选择用模板替换现有布局或将其附加到现有布局。

该模板也很快插入到您的页面中。

可以通过顶部导航菜单左侧的工具菜单找到许多选项。

从这里，您可以保存、复制和预览当前布局。 您还可以通过修订链接查看更改历史记录。

CSS、JavaScript 和其他全局设置（例如边距和填充）也可以更改。

Beaver Builder 缺少 Elementor Pro 和 Divi Builder 等其他解决方案中的一些更高级的自定义选项，尽管它在其他领域表现出色。

界面加载迅速，布局直观，易于理解。 这减少了创建自定义布局所需的时间。

海狸生成器主题

Beaver Builder 主题包含在 Beaver Builder 的 Pro 和 Agency 许可证中。

该主题基于 Bootstrap 框架和 HTML5 构建，可让您使用定制器实时定制您的网站。 它具有对 WooCommerce 的本机支持，并为您提供多种页眉和页脚布局。

主题的每个方面都通过定制器进行控制。 您不会在其他任何地方找到任何选项。 我是 WordPress Customizer 的忠实粉丝，所以我很高兴看到 Beaver Theme 使用它而不是它自己的控制面板。

提供十种配色方案预设。 这将改变标题的颜色，在某些预设中，背景的颜色也会改变。 或者，您可以在定制器的其他区域自己更改所有这些颜色。

您会在 Beaver Theme 中找到许多自定义选项，如果您可以花时间调整一些东西，您应该能够创建一个很酷的设计。 然而，现实是 Beaver Theme 是一个非常简单的 WordPress 主题。 初学者会发现很难改变基本布局之外的主题结构，开发人员会将注意力转向更通用的设计。

海狸主题也不包含在标准许可证中。 开发人员要求再支付 100 美元来获得 Beaver Theme 和 WordPress 多站点支持。

从这个角度来看，每年 89 美元，您可以获得优雅的主题会员资格，并可以访问 Divi 和其他高级 WordPress 插件和主题。

如果 Beaver Theme 包含在标准许可证中，那将是一个不错的奖励。 就目前而言，该主题几乎没有升级的理由。

页面构建器设置

Beaver Builder 有一个用于页面构建器的小设置区域，位于主 WordPress 设置菜单中。

从这里，您可以输入您的许可证信息并选择是否要禁用任何内容模块和帖子类型。 核心和用户模板也可以被激活和停用。

用户访问区域允许您指定哪些用户组可以和不能访问不受限制的编辑、全局行和模块编辑、构建器管理区域和模板数据导出器。

图标部分可让您禁用 Font Awesome 图标、Foundation 图标和 WordPress dashicons。

最后，工具部分可让您清除缓存并启用调试模式。 还有一个卸载选项可以从您的网站数据库中完全删除 Beaver Builder。 这是我希望所有开发人员都添加到他们的 WordPress 产品中的功能。

Beaver Builder 也可以免费下载

Beaver Builder 的免费版本可在 WordPress.org 或直接从您的 WordPress 管理区域下载。

Beaver Builder Lite 目前活跃在超过 300,000 个 WordPress 网站上，但在我看来，它的限制性太强，对主要产品来说广告效果不佳。 相比之下，Elementor 的免费版本是一个更好的解决方案，因为它具有更多的功能和更少的限制。

Beaver Builder 的精简版没有模板系统，只有六个内容小部件：音频、HTML、照片、文本编辑器、视频和侧边栏。 不过，也可以使用默认和第三方 WordPress 小部件。

当 WordPress 产品以免费增值的方式发布时，我的建议通常是先测试免费版本，看看你是否喜欢它。 Beaver Builder Lite 是个例外。 这是一个非常简单的插件，并不足以向用户展示高级版本的功能。

海狸生成器定价

Elementor Pro 的计划是根据您安装插件的网站数量来定价的，而 Beaver Builder 的计划限制了功能。

所有 Beaver Builder 计划都提供一年的支持，并且可以安装在不限数量的网站上。

标准许可证零售价为 99 美元。 以 199 美元升级到专业版许可证会增加 Beaver Builder 主题和 WordPress 多站点功能。 399 美元的代理许可证是为希望使用白标重新命名 Beaver Builder 的公司创建的。

Beaver Builder 提供 30 天退款保证。 在您的续订日期，您的许可证将以 40% 的折扣自动续订（除非您在帐户中禁用自动续订）。

续订折扣将 Beaver Builder 的年度价格降至标准许可证 59.40 美元、专业许可证 119.40 美元和代理许可证 239.40 美元。

Elementor Pro 与 Beaver Builder：总结

Elementor Pro 和 Beaver Builder 是市场上两个最好的 WordPress 拖放页面构建器。

让我们回顾一下每个插件的优缺点。

Elementor Pro 优点：

• 种类繁多的内容小部件和模板以及出色的主题构建器
• 多彩的用户界面
• 免费版有很多很棒的功能，升级到完整版只需49美元

Elementor Pro 缺点：

• 接口不如替代解决方案快
• 内容小部件面板需要您上下滚动才能找到您想要的内容
• 界面可能更直观

海狸生成器优点：

• 界面加载快速且易于使用
• 模板系统运行良好
• 种类繁多的内容小部件，无需滚动即可访问

海狸生成器缺点：

• 当您考虑替代品的成本时，价格昂贵
• 需要更多模块自定义和样式选项
• 海狸主题和多站点支持不包含在标准许可证中

要了解有关这些插件的更多信息，请查看我们对 Elementor Pro 和 Beaver Builder 的专门评论，以及我们对 Beaver Builder 和 Visual Composer 的比较。

您更喜欢哪个拖放页面构建器？ 在下面的评论区告诉我们

凯文