Как создать форму WordPress с полем выбора даты

Вам нужно, чтобы люди выбирали дату при заполнении формы на вашем сайте?? Возможно, вы хотите узнать подходящее время, чтобы позвонить им, или собрать...

Вам нужно, чтобы люди выбирали дату при заполнении формы на вашем сайте??

Возможно, вы хотите узнать подходящее время, чтобы позвонить им, или собрать информацию, такую как дата рождения и т.д. Здесь может помочь поле выбора даты.

В этой статье мы покажем вам, как создать форму WordPress с выбором даты.

Создание формы WordPress с выбором даты

В этом руководстве мы будем использовать WPForms. Это один из лучших плагинов для контактных форм, и вы можете использовать его для самых разных форм.

Вам потребуется установить и активировать плагин WPForms на вашем сайте. Если вы не уверены, как это сделать, посмотрите наше пошаговое руководство по установке плагина WordPress.

Как только вы активировали плагин, перейдите в раздел WPForms » Добавить новую на приборной панели WordPress.

Создание новой формы с помощью WPForms

Появится конструктор WPForms. Сначала введите название вашей формы. Затем наведите курсор мыши на шаблон и нажмите кнопку, чтобы выбрать его. Мы будем использовать шаблон Simple Contact Form.

Выбор шаблона Simple Contact Form для начала создания формы

WPForms автоматически создаст для вас форму, используя этот шаблон. Вот простая контактная форма по умолчанию.

Контактная форма по умолчанию, созданная WPForms

Теперь вы можете редактировать форму любым удобным для вас способом.

Давайте добавим поле выбора даты.

В конструкторе форм в правой колонке вы увидите все поля, которые вы можете добавить в свою форму. Прокрутите вниз до раздела Fancy Fields, и вы увидите поле Date / Time.

Поле Дата/Время в разделе Фантазийные поля

Перетащите поле в нужное место формы. Мы разместили его чуть ниже поля Email в нашей форме.

Поле Дата/Время, добавленное в форму

Далее, нажмите на поле, чтобы отредактировать его. Это вызовет вкладку «Параметры поля» в левой части экрана.

Вы можете изменить метку поля, которая по умолчанию имеет значение «Дата / время». Мы собираемся использовать «Предпочтительное время для телефонного звонка» для нашего поля.

Вы также можете изменить формат поля с помощью выпадающего списка Формат. Например, вы можете использовать только дату и не указывать время, как в случае с полем даты рождения.

Вы также можете отметить поле Required, если хотите сделать это поле обязательным для заполнения. Это означает, что пользователь должен будет выбрать дату и время, прежде чем он сможет отправить форму.

Редактирование поля даты/времени для изменения параметров

Вы можете добавить любые другие новые поля, которые вы хотите использовать. Просто перейдите на вкладку «Добавить поля» и перетащите поле на ваше поле. Чтобы отредактировать поле, просто нажмите на него.

Установка расширенных параметров для панели выбора даты

По умолчанию выбор даты на вашей форме будет представлять собой календарь с выпадающим списком времени рядом с ним. Пользователь просто нажимает на день, чтобы выбрать эту дату.

Выбор даты по умолчанию (стиль календаря)

В выпадающем списке времени по умолчанию установлены 12-часовые часы с интервалом в 30 минут, как показано здесь:

Выбор времени по умолчанию (выпадающий список с интервалом в 30 минут)

Возможно, вы захотите изменить принцип работы переключателя даты. Это легко сделать в WPForms. На вкладке Параметры поля прокрутите вниз до пункта Дополнительные параметры.

Далее нажмите на стрелку, чтобы открыть этот раздел.

Просмотр и изменение дополнительных параметров для поля Дата/Время

Здесь вы можете сделать множество изменений. Например, вы можете захотеть изменить формат даты. По умолчанию это mm/dd/yyyy.

Выбор формата даты из выпадающего списка Date Options

Вы также можете переключиться с выбора даты на выпадающий список дат, если хотите. В данном случае пользователь выбирает месяц, день и год из выпадающих полей, как показано здесь:

Выпадающее поле даты в действии в форме

Вы также можете изменить выбор времени. По умолчанию часы 12-часовые, но вы можете переключить их на 24-часовые, если хотите. Вы также можете изменить интервалы на 15 минут или 1 час вместо 30 минут.

Изменение временных интервалов для выбора даты

Как только вы будете довольны своей формой, вы можете сохранить ее, нажав на кнопку Save в правом верхнем углу.

Вы также можете настроить форму таким образом, чтобы заполнивший ее человек получал копию предоставленных им данных.

Это может быть полезно, например, если они планируют звонок с вами. Они получат по электронной почте запись о времени заказа звонка.

Вы можете сделать это, следуя инструкциям в нашем руководстве по созданию контактной формы с несколькими получателями.

Добавление формы на ваш сайт

Вы можете добавить форму на существующую страницу (или пост) на вашем сайте или создать новую. Чтобы создать новую страницу, перейдите по ссылке Страницы » Добавить новую в вашей приборной панели WordPress.

Затем вам нужно будет добавить новый блок на вашу страницу. Нажмите на (+), чтобы добавить блок, затем выберите блок WPForms. Вы можете найти его в разделе Виджеты или найти его с помощью строки поиска.

Добавление блока WPForms на вашу страницу или пост

Далее вам нужно выбрать форму из выпадающего списка WPForms, как показано здесь:

Выбор нужной формы из выпадающего списка WPForms

Это все, что вам нужно сделать. Теперь вы можете опубликовать свою страницу, и ваша форма появится на вашем сайте. Это должно выглядеть примерно так:

Готовая форма выбора даты на сайте

Примечание: Стиль формы будет зависеть от используемой вами темы WordPress.

Все формы, созданные с помощью WPForms, изначально дружественны к мобильным устройствам и будут работать на любых мобильных устройствах. Инструмент выбора даты WPForms также удобен для мобильных устройств и работает на экранах любого размера.

Мобильный предварительный просмотр выбора даты в форме WordPress

Всегда полезно протестировать свою форму, чтобы убедиться, что она работает так, как вы ожидали. Если вы не получаете электронные письма, но уверены, что ваши настройки уведомлений верны, вам поможет наша статья о том, как исправить проблему WordPress, не отправляющего электронные письма.

Вы можете внести изменения в свою форму, перейдя по ссылке WPForms » Все формы. Затем просто нажмите на название формы или на ссылку «Редактировать» под названием, чтобы отредактировать ее.

Редактирование формы, которую вы уже создали в WPForms

Как только вы сохраните форму, она будет обновлена на вашем сайте автоматически.

Надеемся, что эта статья помогла вам узнать, как создать форму WordPress с датапикером. Возможно, вы также захотите взглянуть на наши статьи о том, как блокировать спам в контактных формах в WordPress и как отслеживать и сокращать количество брошенных форм в WordPress.

Источник: www.wpbeginner.com

Оцените статью
Добавить комментарий