如何使用条件逻辑创建多功能的 Divi 联系表
已发表: 2021-09-23并非每个访问者都出于同样的原因访问您的网站。 您可能会提供一系列产品或服务,而不仅仅是客户和客户的单一选择。 这就是为什么拥有多个有针对性的联系表格可以帮助您理顺您网站的用户体验,以便您的客户(和潜在客户)可以尽可能少地与您联系,准确地了解他们的需求。 使用 Divi 联系表单模块和我们的条件逻辑功能,我们将引导您尽可能在您和您的用户之间创建最佳管道。
有条件联系表格预览
当一切都说完了,你的网站上就会有类似的东西,供访问者使用。
桌面
移动的
什么是条件逻辑?
首先,我们想简要说明条件逻辑的含义。 我们在本教程中要做的是设置一系列联系表单,这些表单基于用户做出或不做出的选择而出现。
例如,您可以使用一个联系表单,根据访问者需要的服务或产品进行调整。 这样,您可以获得所需格式的信息,而无需他们将其写出来。 联系表单上的条件逻辑可以增强沟通并加快您为用户提供服务的能力。
考虑到这一点,让我们深入研究创建目标联系表单。
如何使用条件逻辑创建联系表单
加载 Divi Builder
由于我们使用的是 Divi Contact Form 模块,因此我们需要进入 Divi Builder。 我们将使用 Landscape Maintenance 布局包作为本教程中的示例。 您可以使用任何您想要的布局或设计,但您需要能够使用和设计 Divi 联系表单模块。
首先从 WordPress 网站的后端输入 Divi Builder。 在页面编辑器中,您将看到一个紫色按钮,上面写着使用 Divi Builder (如果您已经创建了页面,则使用 Divi Builder 进行编辑)。

添加或查找联系表单模块
然后,您需要找到页面上已经存在的联系表模块,或者单击黑色 + 圆圈图标并在下拉菜单中找到联系表。

输入联系表设置
Divi 联系表单模块默认带有 3 个字段: Name 、 Email和Message 。 我们要做的是创建一个联系表单,在访问者向我们提供足够的信息以指导他们的查询之前,这些选项不会出现。

添加第一个条件问题
在“内容”选项卡和表单中已有的任何字段下方,您将看到“添加新字段”按钮。 单击那个。

这样做会打开“字段设置”窗口,您应该会看到字段 ID和标题条目的位置。 字段 ID适合您。 这就是模块设置中显示的内容,供您跟踪。 标题是访问者将在表单前端看到的文本。 (标题也会出现在您提交表单时收到的电子邮件中。)

我们将Field ID标记为“Conditional”,因为这是访问者将在表单上看到的第一个问题。 他们对此的反应将决定他们接下来会看到什么。 这是跟踪表单问题和答案流程的简单方法。
添加字段选项
接下来,在“内容”选项卡下滚动到“字段选项”部分。 您将在此处添加可供用户选择的选项。 这些中的每一个都将触发某些后续问题。 在这个例子中,我们使用复选框作为我们的输入类型。 这意味着用户可以根据需要选择任意数量。

除了Checkboxes 之外,Divi 还允许其他选项:用于用户自己键入的响应的Input Field和Textarea,用于您提供的单一选项的Select Dropdown和Radio Buttons ,以及用于电子邮件地址输入的Email Field 。 默认的Name字段是一个Input Field ,而Message是一个Textarea 。

选中复选框后,我们将输入稍后要触发不同选项的选项。 然后我们要确保这是一个必填字段,这样用户就不能过早提交表单。

这里需要注意的是,我们没有在这一步中添加条件逻辑。 这是触发器,因此无论如何它都会出现在用户面前。
为条件响应添加新字段
但是,接下来,我们将为作为后续响应添加的新字段添加条件逻辑。 因为我们为初始问题包含了 3 个选项,所以我们将在表单中添加 3 个新的对应字段。 您将为每个步骤重复以下步骤。

在新字段中命名条件响应
请注意,我们使用了Conditional 1的命名约定(表示第一个条件触发器),然后使用1a 、 1b和1c用于后续响应。 我们还适当地标记了它们,以便我们可以跟踪它们是什么。

与第一个问题一样,我们还将输入标题作为访问者将看到的问题。
向响应字段添加条件逻辑
之后,向下滚动到该字段内容选项卡下的条件逻辑部分。 启用Conditional Logic的开关。 然后,选择此关系的关系,这意味着您可以将其设置为任意(任意数量的响应都可以使此选项弹出)或全部(仅响应的特定组合使此字段出现)。
如果您像我们一样只使用单个触发规则,则任何一个或全部都将起作用。

在Rules 下,您将看到触发此字段的字段,在右侧,您可以选择将触发它的选项。 中心是限定词,如等于、不等于、小于、大于等。 对于此特定字段,我们选择设置为条件 1的问题,然后选择其中专门触发此字段出现的选项。
对所有条件响应重复此操作
由于我们为单个条件问题添加了三个不同的响应,因此我们也将针对其他字段重复此确切过程。 仅为该选择创建适当的相关响应。
设置联系表单 Fiends '姓名/电子邮件/消息' 出现
一旦您为条件逻辑设置了响应,我们希望访问者实际上能够提交表单。 为此,我们将调整Name 、 Email和Message字段中的条件逻辑。 每个设置的设置完全相同,因此您将再次重复此操作 3 次。
在Name 、 Email和Message字段设置中,进入Conditional Logic 。 启用它并添加尽可能多的对有条件的后续问题的最终回答。 在我们的例子中,我们有 3 个后续问题,因此我们使用了 3 个规则。

对于每条规则,选择后续问题作为触发器。 将限定符设置为is not empty ,表示只要访问者回答了问题,就满足条件。 这将使最后一个框变灰,表明任何答案都足够了。
保存您的更改,并对您希望出现的任何字段重复此操作以允许表单提交。 就是这样! 您的表单将立即根据用户的需求进行调整。
最终结果
您可以在下面看到条件逻辑在实践中是如何工作的。
桌面
移动的
包起来
联系表格是网站中最普遍的元素之一。 几乎每个站点都有一个,并且几乎每个站点都需要一个。 但并非每个用户都出于同样的原因访问您的网站。 通过使用 Divi 的条件逻辑功能,您可以将您的联系表格自定义为一个多功能工具,供您的用户与之交流。
您使用 Divi 条件逻辑功能制作了哪些表格?
Kubko/shutterstock.com 提供的文章特色图片
