Создание формы обратной связи на WordPress — плагин contact form 7

Как создать форму обратной связи? Ломал голову наверно сутки тем более мне нужно было не просто форма, а чтоб были еще дополнительные функции (каптча, список категорий и тд). Сперва хотел сам написать, потом решил оставить эту затею и нашел в интернете очень полезный плагин для созданий форм.

1. Для начало вам надо скачать это плагин  Contact form 7 , распаковать и активировать его.
Далее Заходим в админку WordPress—->Contact

Заходим в контакт

2. Перед вами откроется форма контакт, копируем форму

Копируем форму обратной связи

3.    1. Создаем станицу, называем  «контакт» или «обратная связь» 2. копируем код на страницу 3. жмем кнопку опубликовать.

Создаем станицу и публикуем

После вы зайдете на контакт и уведите готовую форму обратной связи

Форма обратной связи

Форма как бы готова, теперь в ней нужно ввести необходимые параметры чтобы она правильно отображалась. Заходим обратно в админке—>contact,  cправа от формы будет выпадающее меню generate tag

Генерировать

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

  1. Text field — Используется для создания Имя отправителя и темы, возможны различные параметры
  2. Email field — Выводится поля с email
  3. Text area — Текст для сообщения можете задать различные параметры (rows количество рядов в сообщение можно оставить пустым)
  4. Drop-down menu — Выпадающее меню
  5. Checkboxes — Устанавливает флажки со списком меню
  6. Radio buttons — Аналогично Checkboxes устанавливаются круглые кнопки со списком меню
  7. Acceptance -Кнопка (что-то вроде я согласен с правилами) после нажатия на нее можно отправить форму
  8. Quiz — Встроенная  каптча  сложения цифр (вы можете  задать ему любое сложение задается в таком формате 1+3=?|4)
  9. File upload- С помощью это меню можно прикрепить файл и отправить на почту
  10. Submit button — Кнопка отправки сообщения
  11. CAPTCHA —  Капча с символами (отдельный плагин требует установки)

Стандартная форма обратной связи создается сразу, при добавления специального кода на страницу,  вам уже предлагаться готовая форма,  остается только ее подредактировать и к каждому пункту с генерировать код и вставить в редактор формы.  Ниже я приведу пример как это делается.

После того как вы войдете в меню contact в админке перед вами будет редактор форм и   generate tag с выпадающим меню,  выбираете любой из пунктов меню и откроется мини редактор:

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

Первый код я с генерировал для поле  вода имени, а второй для темы.

Защита от спама в форме обратной связи

Для начало вам надо скачать плагин  Really Simple CAPTCHA и активируйте его. Он также появиться в списке generate tag.  Вам надо будет генерировать код т.есть просто нажимаем в меню на каптчу. Там будет 2 кода первый код  это картинка, а второй код это поля для символов с картинки , эти два кода вам надо вставить после сообщения перед кнопкой отправить. Я думаю здесь ни чего сложного.

Введите код с картики

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

  1. Ваш емаил куда будут приходить сообщения
  2. Скопируйте с формы сообщения только последний код например [textarea textarea-190] копируем только [textarea-190]
  3. Ваше имя также копируем последний код
  4. Емайл отправителя антологичным способом.

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

18 комментариев

  1. Roman
  2. Тимур
  3. Roman
  4. Тимур
  5. Little Richard
  6. Андрей
  7. Roman
  8. Рудик
  9. Roman
  10. Рудик
  11. Аня
  12. Anna
  13. Roman
  14. Dadawoxr
  15. TamaraNnov
  16. Ирина М.
  17. Ирина М.
  18. Mir-On

Leave a Reply