Плагин Contact Form 7 для WordPress: установка и настройка

Приветствую своих читателей на моем блоге! Сегодня я хотел бы рассказать вам про популярнейший и функциональный плагин как Contact Form 7.

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

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

  • Простое и интуитивное создание форм
  • Поддержка выпадающих списков, чекбоксов, радио-кнопок, отправки файлов и капчи
  • Настройка различных форматов полей: телефон, email и прочее
  • Индивидуальная настройка предупреждений, ошибок и уведомлений об успешной отправки формы
  • Возможность создания собственного шаблона текста письма, который будет приходить на email
  • Получение согласия на обработку персональных данных, что особенно актуально для РФ
  • Не нужно ковыряться в коде что-то проверять на работоспособность и изобретать велосипеды

Также меня очень порадовала поддержка AJAX из коробки, что делает использование CF7 намного удобнее для пользователей.

Настройка Contact Form 7

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

Установив WPCF7, в админ панели можно будет увидеть новый пункт меню, который называется Contact. Он имеет всего несколько вкладок: Contact Forms, Add new и Integration.

Главное меню плагина Contact Form 7

Перейдя во вкладку Contact Forms, мы сможем увидеть, что у нас есть предустановленная форма. Её можно отредактировать или удалить. Но для примера я создам новую, нажав в верхней части экрана «Add New«.

Контактные формы

Перед нами появится страница, на которой мы должны ввести название для нашей формы (оно выводится только в админке), а также несколько вкладок: Form, Mail, Messages и Additional Settings.

WPCF7 Редактор форм

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

Для настройки конкретного элемента (тега), указания ему класса, id или сделать его обязательным, над основным полем расположены кнопки, которые значительно упрощают этот процесс и сводят его к нескольким кликам.

Редактор форм CF7

Думаю, что с этим все ясно. А сейчас перейдем к следующей вкладке.

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

Настройка почты в Contact Form 7

Думаю, что с настройкой этой вкладки также не возникнет вопросов. Кстати, если вы что-то сделаете неправильно, плагин сам подскажет вам где именно причина ошибки. Первые разы, когда я только начинал работать с WPCF7 у меня были проблемы с настройкой тегов, которые используются в полях кому и от кого.

Но когда я немного напряг мозг, то я понял, что все предельно просто.

Вкладка Messages отвечает за взаимодействие с пользователем, а именно выводит различные уведомления в зависимости от события: сообщение о незаполненном поле, неправильно введенном email или об успешной отправке формы. Лично я оставляю все как есть.

Также в плагине Contact Form 7 реализованы дополнительные настройки (Additional Settings). Через них можно управлять формой с помощью так называемых сниппетов. Но по правде говоря я даже не разу ими не пользовался.

Contact Form 7: вывод формы на страницу

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

WFCF7 шорткод

Просто копируем его, а затем вставляем на ту страницу, где нужно вывести форму.

Но я хочу отметить, что если вам надо вывести форму в самом шаблоне, то простой копипаст не сработает. Для вывода формы в теме придется воспользоваться такой конструкцией:

<?php echo do_shortcode(‘[contact-form-7 id=»123″ title=»Форма обратной связи»]’); ?>

В коде это выглядит примерно вот так:

Добавление контактной формы в тему

В таком случае все будет работать. Теперь осталось только проверить форму на работоспособность!

Подводя итоги, хочу сказать, что Contact Form 7 — это отличное решение, которое позволит быстро реализовать поставленные задачи, а также сэкономит немало времени и сил.

Комментарии к записи «Плагин Contact Form 7 для WordPress: установка и настройка»

Комментариев пока нет, но вы можете стать первым