跳到主要内容

当人们在您的网站上填写表格时,您是否需要挑选日期?

也许您想知道打电话给他们的好时机,或者您想收集诸如出生日期等信息。这就是日期选择器字段可以提供帮助的地方。

在本文中,我们将向您展示如何使用日期选择器创建WordPress表单。

如何使用日期选择器创建wordpress表单
如何使用日期选择器创建wordpress表单

使用日期选择器创建WordPress表单

在本教程中,我们将使用WPForms。它是目前最好的联系表单插件之一,您可以将其用于各种不同的表单。

您需要在站点上安装并激活WPForms插件。如果您不确定如何执行此操作,请查看有关如何安装WordPress插件的分步指南。

激活插件后,转到WordPress仪表板中的WPForms»Add New

Wpforms Add Form WordPress
Wpforms Add Form WordPress

将显示WPForms构建器。首先,为您的表单输入名称。然后,将鼠标光标悬停在模板上,然后单击按钮将其选中。我们将使用简单联系表单模板。

Simple Contact Form Template
Simple Contact Form Template

WPForms将使用该模板为您自动创建一个表单。这是默认的简单联系表格。

Simple Contact Form Default
Simple Contact Form Default

现在,您可以按自己喜欢的任何方式编辑表单。

让我们添加日期选择器字段。

在表单构建器中,您将在右栏中看到可以添加到表单中的所有字段。向下滚动到“花式字段”部分,您将看到“日期/时间”字段。

Fancy Fields Date Time
Fancy Fields Date Time

将字段拖放到表单上所需的位置。我们已将其放置在表单上“电子邮件”字段的正下方。

Date Time Field On Form
Date Time Field On Form

接下来,单击该字段以对其进行编辑。这将在屏幕左侧弹出“字段选项”标签。

您可以更改字段的标签,默认为“日期/时间”。我们将在字段中使用“首选通话时间”。

您还可以使用格式下拉菜单更改字段的格式。例如,您可能只想使用日期而不使用时间,例如用于出生日期字段。

如果要将此项设置为必填字段,也可以选中“必需”框。这意味着用户必须先选择日期和时间,然后才能提交表单。

Edit Date Time Field
Edit Date Time Field

您也可以添加要使用的任何其他新字段。只需点击“添加字段”标签,然后将该字段拖放到您的字段上即可。要编辑一个字段,只需单击它。

为日期选择器设置高级选项

默认情况下,表单上的日期选择器将是一个日历,旁边是一个时间下拉列表。用户只需单击一天即可选择该日期。

为日期选择器设置高级选项
为日期选择器设置高级选项

时间下拉菜单默认为12小时制,间隔30分钟,如下所示:

Default Time Picker
Default Time Picker

您可能需要更改日期选择器的工作方式。在WPForms中很容易做到。在“字段选项”选项卡中,向下滚动到“高级选项”。

接下来,单击箭头以打开该部分。

Date Time Advanced Options
Date Time Advanced Options

在这里,您可以进行很多更改。例如,您可能要更改日期格式。默认值为mm / dd / yyyy。

Date Options Dropdown
Date Options Dropdown

如果愿意,还可以从日期选择器切换到日期下拉列表。在这种情况下,用户从下拉框中选择月,日和年,如下所示:

您还可以更改时间选择器。默认为12小时制,但您可以根据需要将其切换为24小时制。您也可以将间隔更改为15分钟或1小时,而不是30分钟。

对表单满意后,可以单击右上角的“保存”按钮将其保存。

您可能还需要设置表格,以便填写表格的人获得他们提交的详细信息的副本。

例如,如果他们正在与您安排通话,这可能会有所帮助。他们将收到他们预订的通话时间的电子邮件记录。

您可以按照我们的教程中有关创建具有多个收件人的联系表单的说明进行操作。

将您的表格添加到您的网站

您可以将表单添加到网站上的现有页面(或发布),也可以创建一个新页面。要创建新页面,请转到 WordPress仪表板中的页面»添加新页面

然后,您需要在页面上添加一个新块。单击(+)添加块,然后选择WPForms块。您可以在“小部件”部分找到它,也可以使用搜索栏搜索它。

将您的表格添加到您的网站
将您的表格添加到您的网站

接下来,您需要从WPForms下拉列表中选择表单,如下所示:

Wpforms Dropdown Select Form
Wpforms Dropdown Select Form

这就是您需要做的。现在,您可以发布页面,并且表单将在您的网站上发布。它看起来应该像这样:

Date Picker Form Finished
Date Picker Form Finished

注意:表单的样式将取决于您使用的WordPress主题

使用WPForms创建的所有表单都是易于移动的,并且可以在任何移动设备上使用。WPForms日期选择器工具还适合移动设备使用,并且适用于所有屏幕尺寸。

测试您的表单以确保它能按预期工作始终是一个好主意。如果您没有收到电子邮件,但是确定您的通知设置正确,那么有关如何修复WordPress不发送电子邮件问题的文章应该会有所帮助。

您可以转到WPForms»所有表单更改表单。然后,只需单击表单标题或标题下方的“编辑”链接即可对其进行编辑。

保存表单后,它将自动在您的网站上更新。

回到顶部