The 8 Best WordPress Page Builder Plugins Compared 2018 – aThemes

8个最好的WordPress页面生成器插件比较2018年

试图为您的网站决定最好的WordPress页面构建器?

八个不同的WordPress页面构建器亲自动手,帮助您做出决定。是的 – 我使用了其中的每一个 – 这不仅仅是基于营销副本的列表

我将客观地将这八个WordPress页面构建器分为五类:

  1. 界面界面如何工作,是否可以轻松构建漂亮的页面?
  2. 包含的小部件/模板 – 您可以使用哪些选项来构建页面?
  3. 样式选项 – 如何设置页面上的元素样式?
  4. 其他值得注意的功能 – 页面构建器是否提供任何值得注意的独特功能?
  5. 锁定 – 如果您想要禁用该插件会发生什么?您将永远失去自定义样式,但有些页面构建器会留下干净的代码,而有些则不会。

对于每个类别,我将为页面构建器提供5分的分数。

然后,最后,我将把所有内容放在一起,并推荐我认为最好的WordPress页面构建器。

以下是我将看到的八个WordPress页面构建器 – 您可以单击以跳转到特定页面构建器:

或者你可以直接进入比较表

元素

Elementor最初于2016年推出,是此列表中较年轻的页面构建者之一。但即使它起步较晚,Elementor已经迅速在WordPress.org上安装了超过1,000,000个活动安装,使其成为现存最流行的WordPress页面构建器之一。

它声名鹊起的是一个快速,无故障的视觉界面,灵活的样式选项,以及强大的其他功能,如完整的主题建设。

阅读我们的Elementor Pro评论

价格:免费核心版。Elementor Pro起价49美元,可在单个网站上使用。

界面 – 5/5

Elementor界面分为两个核心部分,第三个区域用于一些较小的设置:

  • 1 – 这是您设计的实时预览。它看起来就像你的访客会看到它。您还可以直接在此界面中键入文本,以及拖放各种元素以重新排列它们。
  • 2 – 显示您可以使用的元素列表。你只需将它们拖过来。当您选择单个元素或部分时,您可以在其中进行样式设置。
  • 3 – 这些可帮助您访问响应式预览,撤消/重做更改以及其他较小的功能。

例如,下面介绍如何拖动文本小部件,然后只需在页面上键入(内联编辑)即可更改文本:

包含的小部件/模板 – 5/5

在免费版本中,Elementor包含28个免费小部件您还可以使用所有核心WordPress小部件。Pro版本增加了另外~30 个小部件,在Pro版本中总共提供了58个小部件

免费版还附带~40个免费模板专业版增加了数百个额外的模板。

模板有两种格式:

  • 页面 – 您只需编辑的整页设计。
  • – 可以像Legos一样放在一起的各个部分。

您还可以将自己的设计保存为模板,以便以后重复使用。

造型选项 – 5/5

当您单击任何部分,列或窗口小部件时,Elementor会在左侧边栏中提供三个样式选项卡。

确切的选项取决于您正在编辑的元素,但通常Elementor提供任何页面构建器最深的样式选项集之一。

除了颜色,背景和排版等基本内容之外,您还可以控制更高级的设置,例如:

  • 自定义边距/填充。
  • 自定义CSS类/ ID。使用Elementor Pro,您可以直接将CSS样式添加到单个元素中。
  • 响应控制。您可以在特定设备上显示/隐藏元素。

其他值得注意的功能 – 5/5

这些功能在Elementor Pro中可用:

  • 完整的主题建设。您可以使用相同的Elementor界面来构建标题,页脚,单个和档案等模板部件。基本上,您可以使用Elementor构建整个主题。
  • 全局小部件。这些允许您跨多个页面重用公共元素,并通过更新全局窗口小部件来编辑全局窗口小部件的所有实例。
  • 嵌入任何地方通过小部件或短代码在其他区域中使用Elementor模板。

锁定 – 5/5

如果您曾停用Elementor,它会留下干净的代码。例如,如果你有一个带有Elementor的

标题,你在取消激活Elementor后仍然会有一个

标题 – 它只会使用你主题的样式。

2.海狸生成器

Beaver Builder在页面构建器市场上已经有一段时间了。它输出干净的代码(用于页面构建器),受最终用户和实现者的欢迎,并以新功能和更新的形式定期关注。

还有一些官方附加组件可以与它配对以获得更大的灵活性 – 特别是可选的 Beaver Builder主题和Beaver Themer扩展。

阅读我们的Beaver Builder评论

价格:限量免费版。起价为99美元,适用于有限的网站。

界面 – 5/5

Beaver Builder为其前端可视化构建器提供了独特的界面。您可以从右侧的侧边栏完成大部分工作。但是,只有当您单击顶部栏中的按钮时,才会显示这些侧边栏选项,因此可以随时查看全屏预览:

  • 1 – 单击此按钮打开侧边栏区域
  • 2 – 这是您的设计的实时预览

Beaver Builder最近添加了内联文本编辑功能,这意味着您可以直接在页面上键入以编辑文本或使用显示的弹出窗口:

说实话,在弹出窗口中使用内联编辑有点尴尬。但是你可以轻松地将编辑器固定到侧边栏来修复它。

包含的小部件/模板 – 4/5

在免费版本中,Beaver Builder只允许您访问6个模块,但您也可以使用标准的WordPress小部件。

另一方面,高级版本可让您访问30个模块这些模块也都是模块化的,因此您可以根据需要启用或禁用它们。

在高级版本中,您还可以访问~56页面模板,以及将自己的设计保存为模板的功能。

造型选项 – 5/5

要设置模块和部分的样式,您可以:

  • 使用默认弹出窗口
  • 将窗口固定到侧面以创建侧边栏(您可以在下面的示例中看到这一点)。

确切的选项取决于模块,但通常Beaver Builder可以很好地控制元素,包括自定义间距和响应控件。

Beaver Builder还提供了一个非常独特的切换,可让您根据用户是否登录来显示或隐藏单个模块:

其他值得注意的功能 – 4/5

  • 海狸Themer。虽然这是一个单独的扩展,但它添加了像Elementor这样的完整主题构建功能。
  • 白色标签如果您正在为客户构建网站,则可以轻松地为Beaver Builder添加标签。
  • 海狸生成器主题此可选主题可让您更好地控制网站的外观。

虽然这些独特的功能很好,但我觉得这一点很重要,因为你需要付出更多才能获得它们。

锁定 – 5/5

与Elementor一样,Beaver Builder使用正确的HTML格式留下100%干净的代码。

3. Divi Builder

Divi Builder是Elegant Themes的流行高级页面构建器。虽然它最常用作Divi主题的一部分,但Divi Builder也是一个独立的插件,您也可以将其与其他主题一起使用。

不同于以往的两页的建设者,航空维修Builder允许您使用编辑您的内容既有视觉前端接口,以及一个后端接口,虽然大多数用户可能喜欢的前端接口。

阅读我们的Divi Builder评论

价格: 89美元优雅主题会员资格中的一部分

接口 – 4/5

Divi Builder的后端界面如下所示:

但大多数时候,您将使用前端可视界面。Divi Builder绝对是独一无二的。我不是个人粉丝,但我知道有很多人喜欢它,所以我不会因为这个原因而喋喋不休。

基本上,不是任何类型的侧边栏,一切都是弹出窗口和浮动按钮。您可以在下面看到添加模块的示例:

与前两个页面构建器一样,您也可以使用内联编辑直接在页面上编辑文本:

包含的小部件/模板 – 5/5

Divi Builder包含46个模块,您可以使用它们来构建您的设计:

您还可以访问分布在40个不同布局包中的大量316个预构建模板,以及将您自己的设计保存为模板的功能:

造型选项 – 5/5

与Beaver Builder一样,Divi Builder允许您从弹出窗口设置元素,如果需要,可以将其固定到侧面。

Divi的标志之一就是它给你带来了多少样式控制。在三个不同的标签,您可以配置各种设置,包括响应控制,自定义的间隔和地段多。

您甚至可以将自定义CSS添加到主元素主元素之前/之后。CSS编辑器甚至包括基本验证和自动完成功能!您还可以直接从编辑器打开颜色选择器:

总而言之,Divi Builder通过其造型选项真正突破界限 – 这是件好事。

其他值得注意的功能 – 5/5

  • A / B测试。最佳的额外功能之一是Divi Builder的内置A / B测试系统。没有其他页面构建器可以轻松地在核心中进行拆分测试。
  • Divi主题将Divi Builder与Divi主题配对,可让您完全控制您网站的外观。
  • 用户访问控制Divi Builder包含强大的基于角色的访问控制。
  • WordPress Customizer控件您可以使用本机WordPress定制器自定义某些元素的外观。

锁定 – 3/5

对Divi Builder的一个批评一直是它基于短代码。这意味着如果您停用它,它将在您的内容中留下一堆短代码。

虽然这有点下降,但现在短信代码清理器这样的插件存在问题就不那么严重了您将丢失格式 – 如

标记 – 但您不会丢失内容本身。

4.兴旺建筑师

Thrive Architect是Thrive Content Builder的改进版本。新界面与Elementor的界面有很多相似之处,您可以在一秒钟内看到它。

虽然任何人都可以使用它,但它特别受博主和联盟营销人员的欢迎,因为它专注于转换率。我个人喜欢Thrive Architect的一个原因是它的默认样式开箱即用。

阅读我们的Thrive Architect评论

价格:起价67美元

界面 – 5/5

就像我说的那样,你会看到Thrive Architect的界面和Elementor界面之间有一些相似之处(Elementor排在第一位,如果你想知道的话):

这是同样的想法,你有:

  • 1 – 这是您设计的实时预览。它看起来就像你的访客会看到它。您还可以直接在此界面中键入文本,以及拖放各种元素以重新排列它们。
  • 2 – 显示您可以使用的元素列表。你只需将它们拖过来。当您选择单个元素或部分时,您可以在其中进行样式设置。
  • 3 – 这些可帮助您访问响应式预览,撤消/重做更改以及其他较小的功能。

是的 – 我从Elementor部分复制并粘贴了它

当您单击嵌套元素时,唯一的一点就是breadcrumb选择器。当您想要在元素和节之间快速跳转时,此功能实际上非常方便:

Thrive Architect还提供真正的内联文本编辑。事实上,在我看来,Thrive Architect具有任何页面构建器的最无缝的内联编辑功能:

包含的小部件/模板 – 4/5

Thrive Architect提供40种不同的小部件,包括一些像常青倒计时器这样的整洁小部件

Thrive Architect还包括数百个模板,分为~36″套”。您还可以将自己的设计保存为模板。

造型选项 – 5/5

Thrive Architect在如何处理样式方面打破了Elementor。Thrive Architect不是为您提供标签,而是将所有内容都包含在一个列中。

样式选项相当详细,包括响应控件和自定义间距:

您还可以在页面级别添加自己的自定义CSS 对于单个元素,您只能分配CSS类或ID。

其他值得注意的功能 – 3/5

一个很酷的功能是设置页面事件的选项这些允许您根据特定触发器显示灯箱弹出窗口:

另一个很酷的事情是它与其他Thrive主题产品的集成程度。例如:

  • 如果使用Thrive Optimize,则可以使用Thrive Architect运行A / B测试。
  • 如果您使用Thrive Leads,您可以轻松地将Thrive Leads的详细选项集成到Thrive Architect中。

锁定 – 5/5

Thrive Architect留下了100%干净的代码,如Elementor和Beaver Builder。

5. SiteOrigin页面构建器

SiteOrigin Page Builder已经出现了永远的样子。在”永远”中,它可以在WordPress.org上收集超过100万个活动安装,这使它成为该目录中列出的最受欢迎的页面构建器插件。

虽然SiteOrigin Page Builder比这个列表上的大多数其他选项更轻量级,但它提供了出色的性能和大量有用的CSS控件。

价格:免费。SiteOrigin Premium套装起价29美元

接口 – 3/5

SiteOrigin有两个可用于构建设计的接口。

你有原始的后端编辑器:

您可以拖放块或单击特定块来编辑它。

此编辑器为您提供最大的工作空间,但它缺少任何类型的实时预览。

如果您确实需要实时预览,则SiteOrigin Page Builder添加了实时编辑器模式:

这与此列表中的其他页面构建器不同,因为您无法实际拖放实时预览上的元素但它不仅仅是您设计的预览,因为左侧的抽象框和实时预览之间存在一些交互性。

例如,您可以将鼠标悬停在实时预览上的框中,侧边栏中的相关框也会显示突出显示。您还可以单击实时预览中的元素以打开其设置:

包含的小部件/模板 – 2/5

除了核心WordPress小部件之外,SiteOrigin Page Builder还提供了一个免费的Widgets Bundle插件,它可以添加一组模块化的23个小部件供您使用。它还包括大约25个可以使用的预构建模板,尽管与其他页面构建器相比,这些模板非常准确。

您无法将设计保存为模板,但可以轻松克隆现有页面,从而获得类似的功能。

造型选项 – 3/5

如果您不了解CSS, SiteOrigin Page Builder的样式选项与其他页面构建器相比会令人失望但是如果你习惯使用自己的CSS,它们实际上非常有帮助。

除了添加CSS类和ID之外,您还可以直接将CSS添加到单个元素,包括仅限移动CSS的部分:

您还可以获得大量非CSS样式选项 – 只是没有其他插件那么多。如果您是计划使用自己的CSS的开发人员,则可以为此类别提供插件5。但是我把它降到了3,因为我认为这适合普通用户

其他值得注意的功能 – 2/5

SiteOrgin Page Builder非常轻量级,但您可以在SiteOrigin Premium包中获得基本的自定义帖子类型构建器。

锁定 – 4/5

SiteOrigin Page Builder留下了干净的HTML和短代码。也就是说,一些小部件 – 比如文本编辑器 – 留下了干净的HTML,而其他小部件 – 比如按钮小部件 – 留下了短代码。

6. WPBakery页面构建器

WPBakery Page Builder,以前称为Visual Composer,是另一个大受欢迎的高级页面构建器。这种受欢迎程度的很大一部分来自于WPBakery Page Builder与ThemeForest中99%的主题捆绑在一起的事实。但事实仍然是它被用于大量网站

价格: 46美元

接口 – 3/5

与Divi Builder一样,WPBakery Page Builder为您提供可视化前端编辑以及后端编辑。

如果需要,可以使用后端界面:

但我认为大多数人会在前端更开心,看起来像这样:

您可以使用弹出窗口插入新元素并设置样式 – 没有侧边栏区域,也没有内联编辑。

就个人而言,我不是这种方法的粉丝,但有些人喜欢它,因为当你没有打开弹出窗口时,没有什么可以妨碍实时预览

包含的小部件/模板 – 3/5

WPBakery Page Builder提供了39个元素,以及所有正常的WordPress小部件。但是,其中一些元素将组合在另一个页面构建器中,因此实际数字更像是〜33

你也得到了~86个模板。有些模板是完整页面,而有些模板只是部分。

造型选项 – 3/5

与Elementor或Divi Builder相比,WPBakery Page Builder的样式选项有点受限。

您确实对行有很好的控制权:

但是单个元素的样式选项有点受限。

如果要使用自己的CSS,可以将自定义CSS类或ID添加到单个元素,也可以在页面级别添加实际样式:

其他值得注意的功能 – 3/5

我不确定WPBakery Page Builder 本身是否有任何特别值得注意的独特功能但它所拥有的是一个庞大的第三方附加社区。虽然许多其他页面构建器具有第三方附加组件,但WPBakery页面构建器在数量上是唯一的,这是超过250多个附加组件

锁定 – 3/5

与Divi Builder一样,WPBakery页面构建器会在您的内容中留下一堆短代码,如果您将其停用。

7. Themify Builder

毫无疑问,Themify Builder是Themify的页面构建器产品。Themify将其与许多主题捆绑在一起,为客户提供了轻松的定制选项。但您也可以将其作为独立插件购买,并将其与任何主题一起使用。

价格:轻量级免费版。Pro起价39美元或59美元(取决于附件)

接口 – 3/5

与Divi Builder和WPBakery页面构建器一样,Themify Builder允许您使用后端和前端接口构建设计。

后端界面如下所示:

但同样,大多数人可能会想要使用前端界面,其工作原理如下:

  • 1 – 允许您插入新模块(2种不同的方式
  • 2 – 实时预览
  • 3 – 响应式预览,撤消/重做和其他设置

没有内联编辑 – 您需要在弹出窗口中编辑文本:

包含的小部件/模板 – 3/5

Themify Builder提供了21个模块,以及所有正常的WordPress小部件。

您还可以获得~143个完整页面模板,以及较少数量的,这些基本上是预构建的部分

造型选项 – 4/5

如果单击任何元素,您将获得四个不同的选项卡来帮助设置样式:

  • 内容
  • 造型如下所示
  • 可见性允许您隐藏某些设备上的元素
  • 动画

另一个好处是,Themify Builder允许您自定义响应断点(尽管只在整个站点级别)。

其他值得注意的功能 – 3/5

关于Themify Builder的一个很酷的事情是它仍然允许你使用常规的WordPress编辑器,而其他页面构建器则强迫你使用页面构建器界面来处理所有事情Themify Builder内容在WordPress编辑器中标记,以便您可以在其周围放置内容:

锁定 – 5/5

Themify Builder 在锁定方面有了很大的改进现在,如果您停用它,它会使您的内容落后于干净的HTML。

Brizy

Brizy于2018年4月推出,是目前该列表中”最年轻”的页面构建器。但它来自一个着名的开发者 – ThemeFuse–并且已经快速安装了9,000个有效安装。此外,它简单地为页面构建的某些部分提供了一种独特的方法,这使它成为一个有趣的产品。

界面 – 5/5

Brizy是一个前端可视化页面构建器。

要构建页面,首先必须添加一个块。您可以使用空白块,也可以从预先构建的区块中进行选择:

“独特界面”部分是您开始添加元素后发生的事情。而不是在您自定义/样式元素的侧边栏或弹出窗口,几乎所有内容都发生在内联(包括键入)。

看看我的意思:

结果是一种非常快速的构建页面的方式。

包含的小部件/模板 – 3/5

Brizy目前提供17种元素这个数字很小,但Brizy仍然是新的,所以希望它会随着时间的推移而增加。

它还包括您可以使用的150多个块(模板部分)。

造型选项 – 5/5

由于Brizy的界面如何工作,因此没有像其他页面构建器那样设置样式选项的公式。

您可以展开侧边栏以进行高级设置,例如间距和响应控件:

您还可以在页面级别添加基本样式,这样您就不必手动编辑每个元素:

但大多数情况下,您将使用内联控件来设置元素的样式,从而为您提供良好的控制。

其他值得注意的功能 – 4/5

Brizy的界面非常独特。但该团队正在制作2018年7月的Brizy Pro版本,该版本将添加:

  • 页眉/页脚设计使用相同的Brizy界面
  • 跨多个页面同步的全局横幅

该分数基于这些功能确实已发布的假设

锁定 – 4/5

如果您停用它,Brizy会留下大部分干净的HTML代码。但它仍然在代码中留下了一堆带有Brizy CSS类的div,这会稍微扰乱间距并需要清理。

哪个是最好的WordPress页面生成器?

那么你应该选择这八个页面构建器中的哪一个?好吧,这是分数如何叠加(按顺序):

页面构建器 总体而言(25是最大) 接口 小工具/模板 造型 值得注意的功能 锁相
Elementor 25
海狸生成器 23 4 4
Divi Builder 22 4 3
兴旺的建筑师 22 4 3
Brizy 21 3 4 4
Themify Builder 18 3 3 4 3
WPBakery页面构建器 15 3 3 3 3 3
SiteOrigin Page Builder 14 3 2 3 2 4


个人而言,这也是我向人们推荐它们的方式。

在我自己的网站上,我使用了Elementor和Thrive Architect的混合,具体取决于网站。

如果您正在寻找价格与功能的最佳价值,这里有另一个表格,将得分与定价选项进行比较:

页面构建器 总体而言(25是最大) 免费版? 起始价
Elementor 25 $ 49
海狸生成器 23 $ 99
Divi Builder 22 没有 $ 89
兴旺的建筑师 22 没有 $ 67
Brizy 21 没有专业版
Themify Builder 18 $ 39
WPBakery页面构建器 15 没有 $ 46
SiteOrigin Page Builder 14 $ 29日

现在告诉你 – 您认为哪一个是最好的WordPress页面构建器?

科林新人

Colin Newcomer是一名自由撰稿人,具有SEO和联盟营销背景。他主要通过撰写数字营销和WordPress帮助客户提高网络知名度。你可以雇用他为你的网站写作。

披露:此帖子中的部分链接是联盟链接,这意味着如果您点击其中一个链接并购买商品,我们可能会收到佣金。然而,所有意见都是我们自己的,我们不接受积极评论的付款。

from solgoo’s Site https://ift.tt/2QpgCjT
via IFTTT