切换菜单

制作高转化率的弹出窗口:Popup Maker 和 Beaver Builder

已发表: 2024-03-15

所有 Beaver Builder 产品均可享受 25% 折扣...促销即将结束!了解更多

Popup Maker Integration with Beaver Builder
  • 海狸建造者

制作高转化率的弹出窗口:Popup Maker 和 Beaver Builder

弹出窗口是吸引网站访问者注意力并推动转化的强大工具。但制作具有视觉吸引力且有效的弹出窗口可能非常耗时。这就是 Beaver Builder 和 Popup Maker 这对强大的组合发挥作用的地方!

在 Beaver Builder 2.8 中,我们引入了与 Popup Maker 的集成,这是一个 WordPress 插件,允许用户轻松地在其网站上创建和管理弹出窗口。这种集成使您能够使用我们的页面构建器来设计弹出窗口的内容。它还在编辑时在 Beaver Builder 内呈现弹出窗口,并提供在链接字段中选择弹出窗口以在单击链接时触发弹出窗口的功能。

在这篇博文中,我们将深入研究 Beaver Builder 和 Popup Maker 的集成,探索这对动态组合如何帮助您轻松灵活地创建引人注目的高转化弹出窗口。

  • 弹出窗口制作器和海狸生成器
  • 如何在 Beaver Builder 中添加弹出窗口?
    1. 第 1 步:安装并激活 Beaver Builder 和 Popup Maker 插件
    2. 第 2 步:在 Popup Maker 中创建新的弹出窗口
    3. 第 3 步:使用 Beaver Builder 设计弹出内容
    4. 第 4 步:显示弹出窗口
  • 释放弹出窗口的潜力

弹出窗口制作器和海狸生成器

正在努力设计能引起观众共鸣的迷人弹出窗口吗? Popup Maker 和 Beaver Builder 就是您的最佳选择!

这种强大的集成开启了充满创意可能性的世界。使用 Beaver Builder 的直观界面,以拖放方式打开视觉上令人惊叹的弹出窗口,所有这些都在您熟悉的网站创建流程中:

Popup Maker 的高级功能(如触发器和定位)允许您在正确的时间向正确的受众显示正确的消息。这种动态集成使您可以利用这两个流行插件的优势:

  • 轻松设计:摆脱预构建弹出模板的限制。借助 Beaver Builder,您可以获得渴望的视觉编辑自由。使用直观的 Beaver Builder 界面拖放和自定义弹出窗口。
  • 无缝工作流程:直接在 Beaver Builder 布局中设计弹出窗口。无需在不同界面之间来回切换。这简化了您的工作流程,并让您可以在整个页面设计的上下文中查看弹出窗口。
  • 无与伦比的灵活性: Beaver Builder 的模块允许您创建引人入胜的交互式弹出窗口。嵌入视频、添加表单、展示图像和设计号召性用语按钮 - 所有这些都在熟悉的 Beaver Builder 编辑器中进行。

接下来,我们将引导您在 Popup Maker 中创建弹出窗口。然后,我们将向您展示如何将 Beaver Builder 模块无缝链接到弹出窗口,使您可以使用熟悉的拖放功能直观地设计其内容。

如何在 Beaver Builder 中添加弹出窗口?

在 Beaver Builder 中添加弹出窗口是一个简单的过程,可让您有效地吸引网站访问者。以下是帮助您完成整个过程的分步指南:

第 1 步:安装并激活 Beaver Builder 和 Popup Maker 插件

首先确保 Beaver Builder 和 Popup Maker 插件均已在您的 WordPress 网站上安装并激活。

安装并激活 Popup Maker 插件后,Popup Maker 帖子类型(弹出窗口)将在 Beaver Builder 设置中自动启用。

您可以在 WordPress 管理仪表板的“设置”>“Beaver Builder”>“帖子类型”下找到此设置:

第 2 步:在 Popup Maker 中创建新的弹出窗口

要创建新的弹出窗口,请转到 WordPress 仪表板并导航到Popup Maker > Create Popup 。为您的弹出窗口指定一个描述性名称,以便于识别:

弹出窗口制作器:创建新的弹出窗口

向下滚动以使用设置面板定义弹出窗口的外观。设置触发器以确定弹出窗口何时出现,并配置显示规则以定位特定页面、用户角色或设备:

您可以在此处选择以下类型的触发器:

  • 单击打开:单击时显示弹出窗口
  • 时间延迟/自动打开:在一段时间后显示弹出窗口
  • 表单提交:提交表单后显示弹出窗口
  • 退出意图(高级):当有人将光标移离页面正文时显示弹出窗口
  • 滚动(高级):当有人向下滚动页面的一定百分比或元素进入视图时显示弹出窗口

有关如何添加触发器的更多信息,请查看这篇 Popup Maker 文章:添加弹出触发器。

第 3 步:使用 Beaver Builder 设计弹出内容

这就是魔法发生的地方!使用 Beaver Builder 直观的界面释放您的创造力:

使用 Beaver Builder 和 Popup Maker 创建弹出窗口

单击 Beaver Builder 选项卡启动编辑器。在这里您将能够设计弹出布局。拖放各种 Beaver Builder 模块来构建弹出窗口的内容。添加文本、图像、表单并设置弹出窗口的样式以匹配您网站的品牌:

  • 文本模块:制作引人注目的标题、信息丰富的描述和明确的号召性用语。
  • 图像模块:展示相关产品图像、团队成员或添加视觉兴趣。
  • 视频模块:嵌入引人入胜的视频以吸引注意力并有效地解释您的信息。
  • 表单模块:通过包含选择加入表单或联系表单来捕获有价值的潜在客户。
  • Box 模块:将 Flexbox 和 CSS 网格布局添加到 Beaver Builder 页面生成器布局。
  • 号召性用语 (CTA) 模块:设计突出的按钮,鼓励访问者采取所需的操作,无论是订阅您的新闻通讯、下载电子书还是进行购买。

此外,您可以利用 Beaver Builder 的全局样式功能来保持弹出窗口和网站的设计一致性。

弹出窗口设计完成后,单击“完成”“发布”

第 4 步:显示弹出窗口

最后一步是在页面上显示弹出窗口。只需在 Beaver Builder 布局中选择一个支持链接的模块,例如按钮或标注模块。

然后,在模块设置面板中,导航至“链接”选项。单击“选择”,找到您在 Popup Maker 中创建的弹出窗口,然后从列表中选择它:

Beaver Builder 按钮模块链接设置

保存您的设置,瞧!您的弹出窗口现已链接并准备好吸引您的受众。

释放弹出窗口的潜力

通过将 Beaver Builder 的设计能力与 Popup Maker 的功能相结合,您可以创建高转化率的弹出窗口,无缝融入您的网站设计。以下是一些示例:

欢迎弹出窗口

欢迎弹出窗口是迎接网站新访问者并激励他们加入您的电子邮件列表的绝佳方式。提供引人注目的折扣代码、独家优惠或免费赠品,以换取他们的电子邮件地址。通过提供即时价值,您可以鼓励访问者进一步与您的品牌互动,并为未来的更新和促销活动保持联系。

退出意图弹出窗口

不要让潜在的线索溜走!退出意图弹出窗口旨在吸引即将离开您网站的访问者的注意力。当用户的鼠标光标移向浏览器的退出按钮时,这些弹出窗口就会触发,发出离开的信号。利用这个时机提出最后一刻的优惠,展示他们可能错过的有价值的内容,或提供特殊的激励措施来鼓励他们留下来或将来返回。通过有效地利用退出意图弹出窗口,您可以将放弃的访问者转变为参与的客户和订阅者,最终提高您的转化率和保留率。

滚动触发的弹出窗口

通过滚动触发的弹出窗口吸引访问者探索您的网站。当用户滚动到页面上的特定点时,这些弹出窗口就会出现,在他们积极参与您的内容时吸引他们的注意力。使用滚动触发的弹出窗口来宣传特别优惠、鼓励注册新闻通讯或根据访问者的浏览行为将其引导至相关产品页面。

这些只是您可以使用 Popup Maker 和 Beaver Builder 创建的弹出窗口类型的几个示例。凭借其灵活的设计能力和强大的功能,您可以自定义弹出窗口以满足您的特定目标和目的,无论是增加电子邮件列表、推广特别优惠还是收集受众的反馈。

准备好将您的弹出窗口提升到新的水平了吗?集成 Beaver Builder 和 Popup Maker,释放创意无限的世界,让您的转化率飙升。

我们的时事通讯

我们的时事通讯是亲自撰写的,大约每月发送一次。这一点也不烦人,也不是垃圾邮件。
我们保证。

加入时事通讯

立即尝试 Beaver Builder

Beaver Builder