[contact-form-7 id="24085" title="Feedback RU"]

Новые шаблоны

WordPress. Как работать с формой бронирования

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

WordPress. Как работать с формой бронирования

В форме есть поля для имени, е-мейла, телефона и сообщения, выпадающий список, подсчет количества (count select) , два указателя даты и кнопка (submit) для отправки данных формы на сервер. Если в шаблоне есть форма бронирования и Вы хотите изменить некоторые ее опции:

  1. Войдите в админ панель WordPress.
  2. В меню слева перейдите Appearance/Вид -> Theme Options/опции темы.
  3. Вверху нажмите на вкладку Booking Form(форма бронирования) .
  4. Там находится список опций, названия которых говорят сами за себя:
    • Title(заглавие) здесь Вы даете форме название. Например: book a room:
    • Display ‘Name’ Field? (показывать поле «имя»?) для включения/выключения формы выберите да/нет (yes/no)
    • Text for ‘Name’ Field
      (текст для поля «имя») позволяет вставить текст для поля. Например, Your Name
    • Display ‘Email’ Field? (показывать поле «е-мейл»?) позволяет включить/выключить поле е-мейл
    • Text for ‘Email’ Field (текст для поля «е-мейл») позволяет вставить текст для поля. Например, Email
    • Display ‘Phone’ Field? (показывать поле «телефон»?) позволяет включить/выключить поле телефон;
    • Text for ‘Phone’ Field (текст для поля «телефон») позволяет вставить текст для поля. Например, Phone
    • Default Text for Select Element (стандартный текст для выбора элемента) позволяет вставить текст для выбора элемента. Например, Select room type
    • Display Count Select? (показывать выбор количества?) позволяет включить/выключить подсчет количества;
    • Text for Count Select (текст для выбора количества) позволяет вставить текст для выбора количества (count select). Например, No. of rooms
    • Number of Items in Count Select (число элементов в выборе количества) позволяет вставить число элементов в выборе количества (от 1 до 10), Например, 5
    • Date Format (формат даты) позволяет выбрать формат даты в календаре, например, Default: mm/dd/yy
    • Display Datepickers 1? (показать виджет Datepickers 1?) позволяет включить/выключить виджет Datepickers-1 ;
    • Include Timepicker to Datepickers 1? (добавить виджет времени в календарь1 ?) позволяет включить/выключить виджет времени в виджет календаря 1 Datepickers-1 ;
    • Default Text for Datepicker 1 (стандартный текст для Datepicker 1) позволяет добавить текст в виджет календаря- 1, например, Check in
    • Display Datepickers 2? (показать виджет Datepickers 2?) позволяет включить/выключить виджет Datepickers-2 ;
    • Include Timepicker to Datepickers 2? (добавить виджет времени в календарь1 ?) позволяет включить/выключить виджет времени в календарь 2 (Datepickers-2);
    • Default Text for Datepicker 2 (стандартный текст для Datepicker2) позволяет добавить текст в виджет календаря- 2, например, Check out
    • Display ‘Message’ Field? (показывать поле «сообщение»?) позволяет включить/выключить поле сообщение;
    • Default Text for ‘Message’ Field (стандартный текст для поля «сообщение») позволяет вставить текст в доле сообщения, например, Additional Comments
    • Text for Submit Button (текст для кнопки Submit) позволяет вставить текст для кнопки Submit, например, submit
  5. Чтобы сохранить изменения, нажмите внизу на “Save Options” (сохранить опции) или на “Restore Defaults” (восстановление значения по умолчанию), чтобы повторно их установить.
  6. Откройте страницу с формой бронирования и проверьте сохраненные опции .
  7. Чтобы активировать форму бронирования на странице, через меню Plugins/Плагины –> Installed Plugins/Установленные плагины убедитесь в том, что Contact Form 7 и Contact Form 7 — Dynamic Text Extension plugins , которые также пришли вместе с шаблоном, установлены и активированы
  8. В меню слева перейдите в Contact/Контакт. Если Вы установили шаблон с демо-контентом, то у Вас уже должна быть добавлена форма резервирования. Если нет, то добавьте его нажатием на кнопку “Add New”. (добавить новый)
  9. Например, в Reservation Form 1 (форма резервирования 1) (первая колонка) в поле Form / Форма должно быть следующее  
  10. <div class="reservation-form-user">
    <p><label>First Name:</label>[text* your_name]</p>
    <p><label>Last Name:</label>[text* your_surname]</p>
    <p><label>E-mail:</label>[email* your_email]</p>
    <p><label>Phone:</label>[text* your_phone]</p>
    <p><label>Fax:</label>[text your_fax]</p>
    <p class="area"><label>Special Requirements:</label>[textarea your_requirements]</p>
    <p class="submit">[submit "Send"]</p>
    </div>
  11. а в Reservation Form 2 (форма резервирования 2) (вторая колонка) в поле Form/Форма добавьте следующее:
  12. <div class="reservation-form-user">
    <p><label>First Name:</label>[text* your_name]</p>
    <p><label>Last Name:</label>[text* your_surname]</p>
    <p><label>E-mail:</label>[email* your_email]</p>
    <p><label>Phone:</label>[text* your_phone]</p>
    <p><label>Fax:</label>[text your_fax]</p>
    <p class="area"><label>Special Requirements:</label>[textarea your_requirements]</p>
    <p class="submit">[submit "Send"]</p>
    </div>
  13. В Reservation Form 2 поле Message body (тело сообщения) должно быть заполнено. Например,
  14. From: [your_name] <[your_surname]>
     
    Coise: [selectedItem]
    Date From: [dateFrom]
    Date To: [dateTo]
    No. of rooms: [countSelect]
     
    First Name: [your_name]
    Last Name: [your_surname]
    E-mail: [your_email]
    Telephone: [your_phone]
    Fax: [your_fax]
    State/Province: [your_state]
     
    Special Requirements:
    ----------------------------------------------
    [your_requirements]
    
  15. В поле To: (кому) вставьте е-мейл под Mail of Reservation Form 2 (е-мейл формы резервирования 2). Должно получиться так:
  16. Сохраните изменения и постарайтесь отправить сообщение на сайт через форму бронирования. В случае возникновения ошибки, проверьте версию плагинов

Пожалуйста, ознакомьтесь с детальным, обучающим видео ниже:

WordPress. Как работать с формой бронирования