点击触发的订阅弹窗是一种有效提升网站邮件订阅率的方式。相比自动弹出式弹窗,这种方式更加友好,只在用户主动点击某个按钮或链接时才显示,避免干扰阅读流程。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 中创建点击触发的订阅弹窗,不仅可以提升邮件订阅率,还能让用户在主动参与的状态下更愿意填写表单。这种弹窗形式比自动弹出更自然、更易于被接受。