使用 Elementor Pro 表单构建器添加订阅表单(完整教程)

Elementor 的可视化表单构建器是一款功能强大的工具,可帮助你在几分钟内创建完整且美观的在线表单,无需任何编码。

本文展示一个简单的订阅表单,具备以下三个功能:

访客可以输入信息订阅邮件列表

用户信息将同步到 MailChimp 等第三方邮件系统

成功提交后跳转到领取赠品页面,如电子书、工作表或白皮书

拖放表单小工具

首先,将「Form 表单」小工具拖动到页面中。该小工具默认生成一个基础表单,包括姓名、邮箱、留言,以及提交按钮。

内容 > 表单字段

在「Form 表单」面板中,「Form Fields」部分可以设置表单名称,例如“订阅表单”。

默认会生成三个字段:Full Name、Email 和 Message。

此表单不需要留言字段,点击字段右侧的 X 删除它,仅保留姓名和邮箱。如果需要添加字段,点击「Add Item」。本例中仅保留两个字段。

字段的「内容」选项卡

每个字段都可单独设置,内容包括:

Type 类型:姓名字段类型为 Text,邮箱字段类型为 Email,邮箱字段仅接收带“@”和“.”的格式。

Label 标签:建议设置标签,即使页面上不显示。标签会出现在你收到的通知邮件中。

Placeholder 占位符:作为字段中的提示文字,提示用户填写内容。

Required 必填:建议将姓名和邮箱都设置为「Yes」。

在「Form Fields」底部,可以设定是否显示星号标记必填字段,以及是否显示标签。隐藏标签时,星号也会一并隐藏。

Column Width 栏宽:若希望表单更紧凑,可将姓名和邮箱字段设置为 50%,使它们并排展示。

字段的「高级」选项卡

一般无需修改。但需注意:

字段的 ID 不能留空。若为空,请手动填写。否则表单可能出错。

短代码中包含 ID,可插入邮件中,用来调用对应字段的内容。默认使用 [all-fields] 插入所有字段信息。若不希望插入全部字段内容,可手动调用所需字段的短代码。

通常此类订阅表单保留默认设置即可。

内容 > 按钮设置

大多数基础表单只有一个按钮,即 Submit 提交按钮。若是多步骤表单,还会有其他步骤按钮。

Size 大小:可快速设定字体和按钮间距。

Width 宽度:常用值为 20%。实际设置按页面风格决定。

按钮文字:默认值为 Send,可改为 Subscribe、Get Started、Sign Up 等。

图标设置:如需按钮左侧或右侧加图标,可在此选择,并调整间距。

Button ID 可用于自定义代码调用,一般留空。

内容 > 提交后操作(Actions After Submit)

此部分可定义访客提交表单后的行为。例如发送邮件、连接 MailChimp 或跳转页面。

Email 邮件通知(默认添加)

系统默认添加了 Email 操作。通常建议保留。点击 Email 标签页可设置:

收件邮箱

邮件标题

包含哪些字段信息

邮件内容格式等

Mailchimp 接入

继续添加一个动作:Mailchimp。

在「Actions After Submit」中点击下拉框,选择 Mailchimp

出现 Mailchimp 标签页,点击进入

若尚未设置 Mailchimp 接入,会提示输入 API Key。点击提示跳转到 Elementor 设置页面,填入你的 API Key。

设置完成后,回到 Mailchimp 标签页,即可选择一个 Audience 列表。用户提交表单后,其信息将自动加入列表中。

Redirect 页面跳转

再添加一个动作:Redirect。

在「Actions After Submit」中选择 Redirect

新增 Redirect 标签页后,输入跳转地址

该页面一般是感谢页面,提供用户领取资料的说明或下载链接。

内容 > 附加选项(Additional Options)

此表单不是多步骤表单,可跳过「Steps Settings」,直接查看「Additional Options」。

Form ID:若你想通过自定义代码识别此表单,可设置唯一 ID,通常无需填写。

Custom Messages 自定义提示:启用后可设定个性化提示文字。如将默认提示改为“很抱歉,提交失败,请稍后重试”。

这些提示文字通常在浏览器未显示自身错误提示时才会出现。

样式 > Form 样式设置

功能设置完成后,可在「Style」标签页中进行样式调整。

可自定义以下部分:

表单区域(Form)

输入字段(Form Fields)

提交按钮(Submit Button)

消息提示(Messages)

步骤样式(Steps,若有)

测试你的表单

完成样式调整后,发布或更新页面。建议自行填写一次表单,确认是否正常提交。此订阅表单包含信息收集、第三方接入与重定向功能,是营销系统中不可缺少的一环。

Leave a Reply

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