安静 Elementor Mailchimp 表单 是将访问者转变为订阅者的最快方法之一。 Mailchimp 小部件 在 Elementor 的主插件 将免费 MC4WP: Mailchimp for WordPress 插件中的注册表单放入您的布局中,它为您提供了两种运行方式:显示保存的 MC4WP 表单,或编写您自己的字段标记。下面我涵盖两者,从 Elementor 面板到实时页面。
Elementor Mailchimp 表单小部件的工作原理 #
小部件呈现 a Elementor 中的 Mailchimp 注册表单 通过显示 MC4WP 的表单:Mailchimp for WordPress,这是 ibericode 的免费插件。 MC4WP 保存 API 密钥、受众、双重选择加入和表单消息。小部件添加表单类型选择:显示保存的 MC4WP 表单,或用自己的标记替换其字段。 MC4WP 以任何一种方式处理注册。
在开始之前 #
- 文字出版社 与 元素 已安装并处于活动状态。
- Elementor 的主插件 已安装并处于活动状态,如果您尚未安装,请按照 安装指南.
- Mailchimp 小部件在主插件选项面板中启用。
- 的免费 MC4WP:WordPress 邮筒 安装并激活插件。如果没有它,小部件将显示 WordPress 的 “MailChimp 未激活!”通知而不是表格。
- Mailchimp 帐户和 API 密钥。
将小部件添加到您的页面 #
打开 元素编辑器 并搜索小部件面板中的 “Mailchimp。” 拖动主插件 邮件芯片 widget 进入你想要表单的部分,它显示你的 MC4WP 表单,这里有一个电子邮件字段,一个术语复选框和一个“注册”按钮,关于 Mailchimp API 密钥的红线来自 MC4WP,只有登录的管理员看到它,一旦 MC4WP 连接它就消失了。
使用默认的 Mailchimp 注册表单 #
在"内容"选项卡中,离开 形式类型 上 默认值. X = 1000 = 1000 = 1000 = 1000 = 1000 = 1000 = 1000 = 1000 = 1000 = 1000 = 1000 = 1000 = 1000 = 1000 = 1000 MailChimp 登录表 dropdown 列出了保存在 MC4WP 中的表单,如 “选择你想要的那个,小部件在画布上渲染它,并在 MC4WP > 表单下设置了字段,MC4WP 免费版包含一个表单。
这是获得最快的方法 Elementor 中的 Mailchimp 注册表单 live,因为 MC4WP 已经将字段映射到您的受众。
构建自定义 Mailchimp 表单 #
设置 形式类型 下拉到 定制. A 定制表格 code box 显示为自己的字段标记,它取代了 MC4WP 表单的字段,不要粘贴 Mailchimp 本身的嵌入代码,因为它的表单标签在 MC4WP 表单内部会中断,当您需要额外的字段、自定义标签或特定的复选框布局时,请触及此。
视频中的演示标记使用了一个可以适应的简单结构:
<p>
<label for="email">Email address:</label>
<input type="email" id="email" name="EMAIL" placeholder="Your email address">
</p>
<p>
<label>
<input type="checkbox" name="AGREE_TO_TERMS" value="1" required>
I have read and agree to the terms & conditions
</label>
</p>
<p>
<input type="submit" value="Sign up">
</p>Elementor 外部的标记,如果你更愿意编写和预览,那么那个带有实时预览的并排代码编辑器来自免费 WordPress 邮筒 (MC4WP) plugin,而不是主插件本身。左侧标记,右侧实时预览,因此您可以在粘贴到小部件之前右侧获取布局。
用自定义标记绊倒人们的一件事:你的 name 属性必须与您的 Mailchimp 受众合并标签相匹配。特别是电子邮件字段必须使用 name="EMAIL"的,或者 Mailchimp 不会识别订阅者地址,注册默默失败。
配置您的 Mailchimp API 密钥 #
MC4WP 连接后 API 键行清除。在 WordPress 管理员中,打开 MC4WP > 邮件芯片、粘贴你的密钥并保存,状态变为已连接。然后打开 MC4WP > 表格、勾选应该接收订阅者的受众,并勾选设置选项卡,那里默认开启双选入,还可以添加订阅者标签或重定向网址。
从您的中生成密钥 Mailchimp 帐户设置。保持私密,并且永远不要将其粘贴到自定义表单标记本身中,因为该标记对于任何查看页面源的人来说都是可见的。
样式形式 #
小部件没有 风格 tab。master Addons加载一个小样式表,该表给电子邮件字段和按钮一个50px的高度,一个深色按钮和彩色成功和错误框。MC4WP可以从表单的外观选项卡添加自己的外观,要么是基本样式,要么是浅色,深色,红色,绿色或蓝色主题。使用Elementor高级选项卡进行间距和背景。对于字段或按钮颜色,添加CSS与 自定义 CSS 扩展 和目标 .jltma-mailchimp 所以 Elementor 电子邮件注册表 与您设计的其余部分相匹配。
实时页面上的结果 #
在前端,表格显示电子邮件字段、术语复选框和提交按钮,与您设置的完全相同。在连接 MC4WP 后,每个注册都会发送到 MC4WP 表格中勾选的受众,如果双选入已开启,则订阅者通过电子邮件确认。
常见用例 #
- 博客时事通讯: blog的页脚或侧边栏中掉落一个简单的电子邮件字段。
- 铅磁铁: 将表格与下载按钮配对,以便访问者在获取指南之前订阅。
- 产品发布页面: 在登陆页面上收集早期访问的电子邮件。
- 活动注册: 使用自定义标记添加名称、公司或同意复选框。
- 页脚订阅: 嵌入紧凑型 Elementor 的 Mailchimp 小部件 在网站页脚中。
有关更多表格选项,请参阅 联系表 7 小部件.要使公告栏与注册表一起坐,请尝试 新闻股票小部件.
视频教程 #
Prefer观看?此演练将Mailchimp小部件端到端设置为从选择表单类型到实时页面上的注册表单:
常见问题 #
我可以在 Elementor 中添加 Mailchimp 表单而不进行编码吗?
是将表单类型设置为默认值,然后从下拉中选择您的 MC4WP 表单。小部件渲染您在 MC4WP 中设置的字段。
如何在 Elementor 中创建自定义 Mailchimp 表单?
将"表单类型设置为"自定义,并将您的 HTML 标记粘贴到"自定义表单文本区域中。确保电子邮件输入使用 name=""EMAIL"并且 MC4WP 已连接到您的 Mailchimp 帐户。
为什么小部件说我需要配置 Mailchimp API 密钥?
该行来自 MC4WP。将您的 Mailchimp API 密钥粘贴在 WordPress 管理员中的 MC4WP Mailchimp 设置中并保存。如果小部件显示 WordPress 的 MailChimp 未激活,请首先安装并激活 MC4WP 插件。
我可以在表单中添加名称或电话等额外字段吗?
是的,但仅限于自定义模式。添加带有与 Mailchimp 受众匹配的名称属性的标准 HTML 输入字段合并标签,例如名字的 FNAME。
Mailchimp 小部件在 Master Addons 免费版本中可用吗?
是的。 Mailchimp 小部件在 Master Addons 中是免费的,MC4WP 也是免费的。 Mailchimp 小部件页面 与 Elementor Pro Form 进行比较。
包裹起来 #
主插件 Mailchimp 小部件 是直接添加的方式 Elementor Mailchimp 表单 to any page。go 与默认表单速度, 或者切换到自定义模式, 当你想要完全控制标记和字段。无论哪种方式, 订阅者一旦MC4WP连接, 就会到达你的Mailchimp受众。浏览全套 主插件小部件和扩展 了解更多工具来增加您的列表。
