如何使用Popup Maker插件创建号召性用语 (CTA):分步指南

2021年11月18日16:58:20 发表评论 1,234 次浏览

Popup Maker插件如何创建号召性用语?如果你在 WordPress 网站上提供产品或服务,那么尝试捕捉客户线索很重要。最有效的方法之一是使用弹出窗口或类似的号召性用语(简称 CTA)。

CTA 通常用于帮助构建电子邮件列表,然后你可以使用它来传达各种产品或服务。由于你使用的是自托管 WordPress,你已经知道将几乎任何类型的功能添加到你的网站是多么容易。

这也适用于号召性用语。我使用并强烈推荐Popup Maker,这是一个免费的 WordPress 插件(还有一个高级版本),安装量超过 500,000。

如何使用Popup Maker插件创建号召性用语?在本分步指南中,我将向你展示如何使用 Popup Maker 插件免费向你的 WordPress 网站添加号召性用语。

目录

开始之前需要考虑的事项

缓存插件问题

结论

开始之前需要考虑的事项

在你决定向你的网站添加号召性用语之前,你需要花点时间考虑一下你想用它做什么。

你想提供:

  • 免费下载或咨询
  • 产品或服务折扣
  • 限时特价或促销优惠

一旦你弄清楚将如何在你的网站上使用 CTA,你就可以安装并激活 Popup Maker 插件。

请注意:你可以创建和使用多个 CTA 并将它们显示在相关页面和/或博客文章上。

安装 Popup Maker 插件

既然你已经考虑了如何以及为什么要使用号召性用语,你就可以安装 Popup Maker 插件了。我们将从免费版本开始,但你可能需要高级版本中的附加功能。

在你的 WordPress 仪表板中,转到左侧边栏中的插件>添加新。搜索 Popup Maker,然后单击安装按钮。

如何使用Popup Maker插件创建号召性用语 (CTA):分步指南

安装程序完成后,请继续并单击“激活”按钮。

Popup Maker插件如何创建号召性用语?现在,你已准备好创建你的第一个 CTA。

使用 Popup Maker 创建号召性用语

Popup Maker插件用法示例介绍:在 WordPress 仪表板的左侧边栏中,转到Popup Maker > Add Popup

重要提示:设置弹出窗口时,请确保不时点击“保存草稿”,以免在连接中断时丢失你的工作。

如何使用Popup Maker插件创建号召性用语 (CTA):分步指南

为你的新弹出窗口命名,该名称可用作 CSS 类来触发弹出窗口的显示。

如何使用Popup Maker插件创建号召性用语?接下来,输入将出现在前端弹出窗口顶部的标题。

如何使用Popup Maker插件创建号召性用语 (CTA):分步指南

然后,在编辑器中为你的弹出窗口输入一些内容。这可以包括一个介绍,以敦促你的读者注册你的列表(或你希望他们采取的任何操作),以及一个将他们重定向到表单(或其他页面)的按钮。

如何使用Popup Maker插件创建号召性用语 (CTA):分步指南

使用免费插件,你无法向弹出窗口添加字段,因此我建议添加一些文本和一个按钮,将它们发送到他们可以轻松订阅的页面。

我做什么:在我的网站上,我根据用户正在查看的内容使用两个不同的弹出窗口。我在我的主页上使用我的 WordPress 网页设计提供弹出窗口,在我的博客页面和个人帖子上使用我的时事通讯订阅弹出窗口。

弹出设置

将一些内容添加到弹出窗口后,你需要通过转到内容区域下方的弹出窗口设置框来配置它。

如何使用Popup Maker插件创建号召性用语 (CTA):分步指南

触发器

如何使用Popup Maker插件创建号召性用语?在触发器部分,你可以选择要用于打开弹出窗口的触发器。使用 Popup Maker 的免费版本,你可以从以下选项中进行选择:

  • 单击打开– 使用具有特定 CSS 类的可单击链接。
  • 时间延迟/自动打开- 以毫秒为单位指定时间量。
  • 表单提交- 成功提交表单后打开弹出窗口。

Popup Maker插件使用示例:选择你要使用的触发器,然后选中“你也想设置 cookie 吗?”旁边的框。

如何使用Popup Maker插件创建号召性用语 (CTA):分步指南

然后,从下拉列表中选择设置 cookie 的时间。你可以为你的 cookie 从以下条件中选择:

  • 在弹出关闭
  • 在弹出窗口打开
  • 表单提交
  • 订阅表格:成功
  • 订阅表格:已订阅
  • 手动的

使用 cookie,你可以确保不会向某人多次显示单个弹出窗口(除非他/她清除浏览器缓存/历史记录或在隐私浏览窗口中打开你的网站)。

定位

在此部分中,你可以选择让你在某些页面、帖子、类别和标签页面等上显示弹出窗口的条件。

你还可以有选择地将其从网站的某些部分排除,并在移动设备和平板电脑上禁用弹出窗口。

如何使用Popup Maker插件创建号召性用语 (CTA):分步指南

查看插件的高级版本以了解更高级的定位条件,包括退出意图和滚动触发弹出窗口。

展示

在“显示”选项卡中,你可以完全自定义弹出窗口的外观和位置,甚至可以为其添加动画和声音。

显示预设

  • 中心弹出窗口
  • 右下滑入
  • 顶吧
  • 左下通知
如何使用Popup Maker插件创建号召性用语 (CTA):分步指南

选择所需的弹出位置后,你可以通过在其他选项卡中配置设置来进一步调整外观。

外观

你可以在此处选择要使用的主题。有 6 个主题可供选择,它们都可以根据你的需求和品味进行定制。

如何使用Popup Maker插件创建号召性用语 (CTA):分步指南
  • 默认主题
  • 灯箱
  • 企业蓝
  • 你好盒子
  • 前沿
  • 框架边框

首先,选择一个主题并查看编辑屏幕右上角的预览。然后,你可以单击“自定义此主题”链接并根据需要对其进行调整。确保保存你的更改。

尺寸

在此选项卡中,你可以设置弹出窗口的大小,还可以指定最小和最大宽度。在尺寸下拉菜单下,选择一种响应尺寸。或者,你可以根据需要使用自动或自定义。

如何使用Popup Maker插件创建号召性用语 (CTA):分步指南

以 px、%、em 或 rem 为单位输入最小宽度。为简单起见,我使用了智能手机屏幕宽度的最小像素值。

对于最大宽度,我还指定了一个像素值,并将其设置为看起来不错的宽度。这取决于你选择的弹出主题以及其中的内容数量和大小。

专业提示:调整格式和大小,直到找到你满意的内容。

动画

Popup Maker插件使用示例:在这里,你可以选择向弹出窗口添加动画。从下拉列表中,你可以选择无、幻灯片、淡入淡出或淡入淡出和幻灯片。

如何使用Popup Maker插件创建号召性用语 (CTA):分步指南

然后,你可以以毫秒为单位指定动画的速度。

声音

Popup Maker插件如何创建号召性用语?你可以为弹出窗口从 5 种声音预设中进行选择,甚至可以通过指定声音文件的 URL 来使用自定义声音。

如何使用Popup Maker插件创建号召性用语 (CTA):分步指南

位置

从位置下拉菜单中,你可以指定希望弹出窗口出现的位置。你可以从以下选项中进行选择:

  • 左上方
  • 顶部中心
  • 右上
  • 中左
  • 中间中心
  • 中右
  • 左下方
  • 底部中心
  • 右下角
如何使用Popup Maker插件创建号召性用语 (CTA):分步指南

如何使用Popup Maker插件创建号召性用语?对于除中间中心以外的所有选项,你可以使用下拉菜单下方出现的滑块进一步微调位置。它们允许你设置与浏览器窗口顶部、底部、左侧或右侧的距离(以像素为单位)。

触发器位置- 如果你为弹出窗口使用点击触发器,你可以选中此框以设置与该可点击链接相关的距离。

固定定位- 选中此框会将弹出窗口的定位设置为固定位置。

Advanced

如何使用Popup Maker插件创建号召性用语 (CTA):分步指南

禁用覆盖- 如果你选择此项,它将隐藏此弹出窗口的覆盖。根据你使用的是暗弹出窗口还是亮弹出窗口,叠加层通过使背景变暗或变亮来帮助使你的弹出窗口更加明显。

可堆叠- 如果你使弹出窗口可堆叠,则其下方或上方的其他弹出窗口将保持打开状态。

禁用重新定位- 通过选中此框,你将禁用在重新调整浏览器窗口大小时弹出窗口的自动重新定位。

Popup Z-Index – 这是一个影响弹出窗口堆栈顺序的 CSS 属性。你希望弹出窗口具有高堆栈顺序,以便它始终显示在所有其他站点内容的顶部。默认值为 1999999999,这足以确保你的弹出窗口始终位于所有内容的顶部。

Close

按钮– 在此选项卡中,你可以选择用于弹出窗口中关闭链接的文本或符号,并为关闭按钮的外观添加延迟,Popup Maker插件使用示例:

如何使用Popup Maker插件创建号召性用语 (CTA):分步指南

关闭文本- 我通常使用 X,但你可以选择任何你喜欢的内容。如果你选择输入其 CSS 类(例如“fas fa-camera”),你也可以使用 Font Awesome 图标而不是文本。

关闭按钮延迟– 如果你想延迟关闭按钮的显示,你可以指定一个以毫秒为单位的时间。

请注意:你可以使用高级强制交互扩展完全禁用关闭按钮。

表单提交- 如果你希望在成功提交集成表单后自动关闭弹出窗口,请选中此框。

如何使用Popup Maker插件创建号召性用语 (CTA):分步指南

替代方法

在这里,你可以启用一些用于关闭弹出窗口的其他方法。

如何使用Popup Maker插件创建号召性用语 (CTA):分步指南

单击覆盖以关闭- 如果选中此框,则当用户单击覆盖背景时,它将关闭弹出窗口。

按 ESC 关闭– 添加选项,让用户通过按键盘上的 ESC 键来关闭弹出窗口。

按 F4 关闭- 与上面的选项类似,这将让用户通过按 F4 键关闭弹出窗口。

Advanced

Popup Maker插件如何创建号召性用语?在这个区域,有两个复选框:

在非 ajax 表单提交后禁用自动重新触发弹出窗口- 如果你使用非 ajax 表单来收集信息,你将需要选中此框以禁用重新触发弹出窗口。

禁用辅助功能– 通过选中此框,你将禁用用户点击 Tab 键以在字段之间移动的功能。它在弹出窗口打开时强制聚焦在第一个元素上,并在关闭时重新聚焦最后一次点击触发器。

如何使用Popup Maker插件创建号召性用语 (CTA):分步指南

执行完以上Popup Maker插件使用示例后,完成添加所有内容并为新弹出窗口配置所有选项后,你就可以发布它了。点击“发布”按钮,拍拍自己的后背。

缓存插件问题

正如你在我的其他教程中所注意到的,我建议使用缓存插件来帮助优化你的WordPress 网站。虽然缓存插件是你网站的必备品,但它可能会导致弹出窗口的外观和功能(以及其他项目)出现一些问题。

我是如何发现这个问题的:当我向我的一个网站添加一个弹出窗口时,它最初起作用了。然后,我在 SG Optimizer 缓存插件中启用了 Javascript 缩小(仅适用于使用 SiteGround 托管的网站......但不要使用它们,因为它们现在很糟糕),它根本阻止了弹出窗口的打开。它只会使当前页面完全冻结(滚动条消失,无法执行任何操作)。不幸的是,在 SG Optimizer 中,无法从缩小中排除 Popup Maker javascript。它肯定可以在functions.php 中排除,但我还没有找到它的代码。我刚刚关闭了 javascript 缩小来解决这个问题。

结论

如何使用Popup Maker插件创建号召性用语?如果你希望通过 WordPress 网站获得潜在客户,那么创建高质量的号召性用语至关重要。Popup Maker 让你只需几步即可轻松创建 CTA。虽然根据你的需要配置它可能需要一些时间,但我希望本教程可以帮助你。

我错过了什么吗?我努力使我的教程尽可能有用,但请随时告诉我如何改进它。如果你有任何疑问或需要帮助,请发表评论,我会尽力为你指明正确的方向。

木子山

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: