如何在 Elementor 中创建点击触发的订阅弹窗

点击触发的订阅弹窗是一种有效提升网站邮件订阅率的方式。相比自动弹出式弹窗,这种方式更加友好,只在用户主动点击某个按钮或链接时才显示,避免干扰阅读流程。Elementor 提供强大的弹窗构建工具,能够轻松实现这一功能。

本文将介绍如何使用 Elementor 创建点击触发的订阅弹窗,涵盖从模板创建、触发配置到页面按钮连接的完整步骤。

一、创建订阅弹窗模板

1. 进入弹窗模板创建页面

登录 WordPress 后台;

前往 模板 > 弹窗(Popups);

点击“新增弹窗(Add New Popup)”。

为弹窗命名,如“订阅弹窗”,点击“创建模板(Create Template)”。

2. 选择或设计弹窗布局

Elementor 会提供多种预设弹窗模板;

可选择一个适合的模板,或点击“×”使用空白模板自行设计;

点击“插入(Insert)”打开模板编辑器。

3. 添加订阅表单

拖动“表单(Form)”小工具至弹窗中;

设置字段内容,通常只需:Email(必填);

可选添加 Name 字段,提升个性化体验;

简洁设计通常有助于提高填写率。

4. 配置提交操作

修改按钮文案,如“立即订阅”或“获取更新”;

在“提交后的操作(Actions After Submit)”中,选择:Email;

或集成 MailChimp、ActiveCampaign 等;

设置提交后的反馈消息或感谢提示。

5. 美化弹窗样式

使用“样式(Style)”标签自定义颜色、边距、字体等;

可添加吸引人的标题,如“订阅最新消息”或“不错过任何更新”。

6. 发布弹窗

点击“发布(Publish)”,进入显示条件设置界面。

二、设置弹窗显示与触发条件

1. 设置显示条件(Display Conditions)

点击“添加条件(Add Condition)”;

可选择“全站(Entire Site)”或特定页面。

2. 关闭自动触发器

禁用“页面加载时”、“滚动时”等自动触发选项;

目的是让弹窗只在点击特定元素时显示。

3. 保存设置

点击“保存并关闭(Save & Close)”。

三、创建点击触发的链接或按钮

1. 编辑要插入触发链接的页面

用 Elementor 打开对应页面;

插入一个“按钮(Button)”或“文本链接(Text)”小工具,文案可设为“立即订阅”或“获取资讯”。

你也可以将触发器设置在图标、图片或其他可点击元素上。

2. 设置触发动作

选中按钮,点击“链接设置(Link Settings)”;

设置链接类型为“动态标签(Dynamic Tags)”;

从下拉列表中选择“动作 > 弹窗(Actions > Popup)”;

选择“打开弹窗(Open Popup)”,并关联之前创建的订阅弹窗;

可添加“关闭弹窗”动作,便于用户手动关闭。

3. 保存修改

点击“更新(Update)”,保存页面设置。

四、测试弹窗功能

1. 预览页面

打开实际页面,点击按钮或链接,检查弹窗是否正常弹出。

2. 提交表单测试

输入邮箱测试提交功能是否可用;

若设置了邮件通知,检查是否收到通知;

若连接了 MailChimp,检查订阅是否成功写入列表。

五、补充建议

添加动画:进入“高级 > 动画”设置,为弹窗添加淡入、滑入等效果;

优化移动端显示:切换至移动端视图,自定义弹窗布局;

限制弹窗频率:避免多个弹窗频繁干扰访问;

添加隐私声明:使用文本小工具简短提示用户邮箱信息安全。

六、总结

Elementor 中创建点击触发的订阅弹窗,不仅可以提升邮件订阅率,还能让用户在主动参与的状态下更愿意填写表单。这种弹窗形式比自动弹出更自然、更易于被接受。

最近更新

Leave a Reply

您的电子邮箱地址不会被公开。 必填项已用 * 标注