Все поля (теги) формы. Все поля (теги) формы Как установить плагин contact form 7

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

Принцип действия плагина Contact Form 7

Данная форма располагается на любой странице вашего сайта (нужно лишь скопировать строчку и вставить ее в нужное место). Посетитель сайта заполняет обязательные поля (к примеру, свое имя, e-mail, сообщение), и плагин через один почтовый ящик (назовем его «отправитель» ) посылает письмо на другой ящик («получатель» ).

Тоесть, вы должны зарегистрировать 2 почтовых ящика – отправитель и получатель . Отправитель лучше создать в Яндекс почте, а получатель – это официальный ящик вашего сайта.

С некоторых пор плагин Contact Form 7 перестал работать — не отправлял письма, а просто крутил загрузку. Я нашел выход — установил другой бесплатный плагин WPForms Lite. Очень прост в настройках, не требует установки дополнительных плагинов для настройки отправки сообщений, но я заметил, что он работает не с каждой электронкой. На одну мне не приходили письма, а на другую отправляются.

Настройка плагина Contact Form 7. Инструкция

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

2) Настраиваем контактную форму плагина Contact Form 7. Нажмите «Изменить» и далее «Шаблон формы» . Вот пример, как она должна выглядеть с обязательными полями: имя пользователя, его почта, сообщение и кнопка «отправить»:

Ваше имя (обязательно)

Ваш e-mail (обязательно)

Сообщение

3) Вкладка «Письмо» отвечает за внешний вид писем, которые вы получаете.

Кому – адрес ящика получатель

От кого – <адрес ящика отправитель>

Тема

Тело письма

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

Внимание! Чтобы плагин Contact Form 7 отправлял письма, необходимо установить еще один плагин WP-Mail-SMTP. Именно он будет связывать два почтовых адреса отправитель и получатель и выполнять системные функции по отправке писем.

Настройка плагина WP-Mail-SMTP. Инструкция

From Email – адрес ящика отправитель

From Name – к примеру, название вашей организации или ваше имя

Mailer – функция отправки писем. Выберите «Send all WordPress emails via SMTP»

SMTP Host – для Яндекс почты smtp.yandex.ru

SMTP Port – для Яндекс почты 465

Encryption – Use SSL encryption

Authentication – Yes: Use SMTP authentication

Username – логин на вашей почте отправитель

Password – пароль на вашей почте отправитель

Настройка завершена. Сохраните изменения.

Как разместить форму обратной связи Contact Form 7 на странице

В настройках контактной формы обратите внимание на строчку наверху:

Ее нужно скопировать и вставить на любой странице. Все готово.

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

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

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

Долго сидел и думал, какие есть минусы в плагина и в голову так ничего и не пришло, а вот плюсов у данного творения очень много.

Плюсы плагина Contact Form 7.

  1. Понятность и простота настройки. Человек, который первый раз сталкивается с данным плагином без проблем сможет разобраться.
  2. Создание большого количества разных форм и интеграция их на сайт.
  3. Форма вставляется с помощью шорткода на страницу и в любое место сайта. Это очень удобно.
  4. Поддержка русского и других языков.
  5. Поддержка Ajax запросов.
  6. Защита от спама с помощью текстового вопроса или капчи. Для капчи необходимо дополнительно будет установить Really Simple CAPTCHA.
  7. Настройка внешнего вида формы с помощью css стилей.
  8. Интеграция с сервисом Akismet, для защиты от спама.

У нас на сайте Вы можете увидеть и поюзать такую форму если нажмете на пункт меню “Связаться с нами”, выпадет окно, где можно увидеть наглядный пример.

Дайте начинать!

Для начала нам необходимо скачать данный плагин. Можно с нашего сервера вот ссылка — >или же с официального сайта вот ссылка — > Скачать с официального сайта .

После, того как скачали необходимо его установить на . Как устанавливать, я не буду описывать, думаю Вы должны этот процесс знать от А до Я. Скачали, установили, теперь непосредственно переходим в сам , что бы разобраться и настроить его.

Настройка плагина Contact Form 7 и создание формы обратной связи.

Теперь когда вы скачали и установили всё как нужно, переходим в административную панель WordPress и находим пункт Contact Form 7 , кликаем по нему и мы попадаем на страницу добавления новой формы.


Создание формы.

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


Форма создана, теперь будем ее настраивать, под ваши нужды и для начала даем ей название. В моем случае я назову “Тест форма ”, вы называйте как хотите и после этого нажимайте «Cохранить». Теперь вы можете увидеть, шорткод который необходимо будет вставлять в код сайта, где будет выводится данная форма.


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

Справа выпадающий список “Сгенерировать тег ”, если его раскрыть можно увидеть много полей которые добавляются в форму.


Поле «Сгенерировать тег»

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

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

Приступает.

Делаем текстовое поле для имени. В выпадающем списке “Сгенерировать тег” выбираем “Текстовое поле ”. Ставим галочку обязательное поле, даем ему название в моем случае “NAME” и присваиваем id, что бы можно было поле оформить с помощью css стилей. У меня получилось id=”name”. Внизу можно увидеть текст “Скопируйте этот код и вставьте его в шаблон формы слева ”. Берем этот код и копируем в шаблон формы, как на картинке:


Для почты (e-mail) аналогично делаем, для телефона выбираем из списка “Сгенерировать тег”, поле “Номер телефона ” и тоже по аналогии делаем.

Для настройки сообщения выбираем “Текстовое поле ” и делаем тоже по аналогии со всем выше описанным.


Теперь добавляем поле «Вопроc «. Для этого в выпадающем списке выбираем пункт “Вопрос ”, задаем ему название. В поле Вопрос|Ответ, можно задавать разные вопросы и ответы, под полем приведен пример логического вопроса, можно задавать текстовый, например “3 по счету месяц года?| Март” и т.д. Код вставляем как и раньше.


поле «Вопрос»

И последнее что нам необходимо, это кнопка “Отправить ”, можно оставить ту, которая в шаблоне или в списке “Сгенерировать тег” выбираем “Кнопка отправки”. Шаблон готов, нажимаем кнопку “Сохранить ”.

Давайте проверим, что у нас получилось, копируем шорткод и вставляем его на страницу или в любую часть кода куда необходимо. Я вставлю на тестовую страницу.

Вот что у меня получилось:


У Вас должно быть, что-то похожее.

Настройка адресата формы и сообщений

Опускаемся немного ниже шаблона формы и видим настройки адресата.

  1. Поле адресат. Вводим почту с которой будут приходить письма посетителям которые заполнят форму.
  2. Поле отправитель. Вместо <>, подставляем свои шорткоды (названия которые давали полям). Посмотреть их можно выше. В моем случае будет <>.
  3. Поле тема. Я всегда пишу Форма обратной связи и указываю сайт.
  4. Поле шаблон письма. Здесь можно выводить, то что душа пожелает. Для нашего примера делаю поле От: <> и данные Телефон: , Сообщение ..
  5. Остальные поля пустые.

В конце не забываем сохранятся.

Если опуститься еще ниже, то можно увидеть настройки сообщений. Здесь всё на русском, поэтому можете править под свои нужды, как хотите. Здесь думаю сами разберетесь

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

У меня всё работает отлично, после нажатия кнопки “Отправить”, вижу сообщение “Сообщение было успешно отправлено. Спасибо . ” Можете тестировать и смотреть какие ошибки форма будет выдавать если не правильно ввести данные.

Что касается css стилей, их можно добавить в главный css файл style.css. С помощью firebag, можете посмотреть id и классы полей и присвоить им соответствующие стили.

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

Contact Form 7 может управлять многочисленными контактными формами, где вы можете гибко настраивать содержимое форм и почты с достаточно простой разметкой. Формы имеют встроенную поддержку Ajax отправки, CAPTCHA, спам фильтра Akismet и не только.

Документация и поддержка

Скриншоты

Установка

  1. Загрузите всю папку contact-form-7 в директорию /wp-content/plugins/ .
  2. Активируйте плагин на странице «Плагины» в панели управления WordPress.

В меню консоли WordPress вы найдёте вкладку ‘Обратная связь’.

Чтобы узнать как правильно пользоваться плагином вы можете посетить его домашнюю страницу .

Отзывы

I see a lot of people hating on this plugin because they"re using some unsupported version that is bundled in a theme, - all I can say from my own experience is that after using it for several years on many sites is a big thank you to the devs that keep it up to date and free for everyone. It"s extremely easy to set up and customize. Cheers!

Участники и разработчики

«Contact Form 7» - проект с открытым исходным кодом. В развитие плагина внесли свой вклад следующие участники:

Участники

Журнал изменений

Для получения дополнительной информации смотрите Релизы .

5.1.6

  • CSS: removes a style rule from the stylesheet that was unnecessary and conflicting with Twenty Twenty’s rules.
  • REST API: retrieves the contact form ID explicitly from the route parameters.

5.1.5

  • Config Validator: New test item for the unavailable_html_elements error.
  • Config Validator: New test item for the attachments_overweight error.

5.1.4

  • reCAPTCHA: Представляем константы WPCF7_RECAPTCHA_SITEKEY и WPCF7_RECAPTCHA_SECRET.
  • reCAPTCHA: Представляем перехватчики фильтра wpcf7_recaptcha_sitekey и wpcf7_recaptcha_secret.
  • Добавление параметра $status к фильтру wpcf7_form_response_output.
  • Создает случайный код, когда пользователь является зарегистрированным пользователем.
  • Представляем WPCF7_ContactForm::unit_tag(), публичный метод, возвращающий тэг юнита.
  • reCAPTCHA: выдаёт иное сообщение в спам-журнал в случаях, когда маркер ответа пуст.
  • Флажок согласия: поддержка опции label_first в согласительном тэге формы.

5.1.3

  • Исправлена ошибка, приводившая к невозможности отменить выбор параметра во вкладке Почта.

5.1.2

  • Постоянный контакт: Представлен селектор списка контактов.
  • Постоянный контакт: Представлена дополнительная настройка constant_contact.
  • reCAPTCHA: представлены перехватчики фильтров wpcf7_recaptcha_actions и wpcf7_recaptcha_threshold.

5.1.1

  • reCAPTCHA: Изменяет реакцию на пустые токены ответа.

5.1

  • Представлен модуль интеграции Постоянный контакт.
  • Обновлён модуль reCAPTCHA для поддержки reCAPTCHA v3.
  • Добавляет правила стиля Тёмного режима.

5.0.5

  • Исправлена проблема несоответствия между get_data_option() и get_default_option() в классе WPCF7_FormTag.
  • Глушит ошибки PHP, возникающие при вызовах unlink().
  • Представлена wpcf7_is_file_path_in_content_dir() для поддержки константы UPLOADS.

5.0.4

  • Явно устанавливает аргумент power_type в вызове register_post_type(), для исправления проблемы, связанной с несанкционированным повышением привилегий.
  • Вложение локального файла — запрещено указывать абсолютные пути к файлам, расположенным вне директории wp-content.
  • Валидатор конфигурации — добавляет тестовый элемент для обнаружения некорректных настроек файлов вложений.
  • Исправлена ошибка в функции обратной совместимости JavaScript для устаревших браузеров, которые не поддерживают атрибут-заполнитель HTML5.
  • Чекбокс согласия — отключает функцию do-not-store форм-тэга.

5.0.3

  • CSS: Применение стиля курсора «не разрешено» при наведение на кнопки отправки в неактивном состоянии.
  • Флажок согласия: ревизия пользовательского интерфейса генератора тегов, для поощрения использования лучших опций защиты личных данных.
  • Внедрение функции wpcf7_anonymize_ip_addr().
  • Представлена опция consent_for:storage для всех типов форм-тэгов.

5.0.2

  • Добавлен раздел «Уведомления о приватности» в файл readme.txt.
  • Обновлен контент в мета-блоке Информация.
  • Используйте get_user_locale() вместо get_locale(), где это более уместно.
  • Флажок согласия: Сброс статуса отключенных кнопок отправки после успешного применения.

5.0.1

  • Исправлено некорректное использование _n().
  • Проверка конфигурации: исправлено неверное количество предупреждений на вкладке «Дополнительные параметры».
  • Проверка конфигурации: исправлена неправильная обработка специального почтового тега [_site_admin_email] в поле заголовка «От».
  • Флажок Acceptance: указанные атрибуты class и id были применены к неправильному элементу HTML.
  • Проверка конфигурации: если для почтовых ящиков, таких как Cc или Reply-To, существует дополнительный почтовый заголовок, но возможное пустое значение, будет возвращена ошибка «Неверный синтаксис почтового ящика».
  • Явно укажите четвертый параметр add_action(), чтобы избежать передачи непреднамеренных значений параметров.
  • Проверьте, не является ли целевой каталог пустым, прежде чем удалять его.

5.0

  • Дополнительные настройки: on_sent_ok и on_submit были удалены.
  • Новая дополнительная настройка: skip_mail.
  • Фламинго: заголовок входящего канала изменяется вместе с изменением заголовка соответствующей контактной формы.
  • События DOM. Весь объект ответа API доступен через свойство event.detail.apiResponse.
  • Почта HTML: добавляет атрибуты, связанные с языком, в заголовок HTML.
  • Загрузка файла: Устанавливает атрибут принятия в поле загрузки.
  • Представлен новый класс WPCF7_MailTag.
  • Позволяет прервать попытку отправки почты, используя перехватчик действия wpcf7_before_send_mail. Кроме того, вы можете установить пользовательский статус и сообщение через перехватчик действия.
  • Флажок Acceptance: позволяет указывать условия в части содержимого тега формы.
  • Флажок Acceptance: Поддерживает параметр опциональности.
  • Новые специальные почтовые теги: [_site_title], [_site_description], [_site_url], [_site_admin_email], [_invalid_fields], [_user_login], [_user_email], [_user_url], [_user_first_name], [_user_last_name], [_user_nickname], and [_user_display_name].
  • Новые перехватчики фильтров: wpcf7_upload_file_name, wpcf7_autop_or_not, wpcf7_posted_data_{$type}, and wpcf7_mail_tag_replaced_{$type}
  • Новые функции form-tag: zero-controls-container и not-for-mail

Добрый день дорогие читатели блога. Продолжаем тему форм обратной связи на WordPress. И раз реч зашла о них, предлагаю сегодня поговорить о плагине WP Contact Form 7. Далее я раскажу вам пошаговую настройку плагина, а также вкратце опишу дополнения для этого плагина.

Навигация по странице:

Описание WordPress Contact Form 7

2) Активировать плагин Contact Form 7 в админке WordPress.

3) Перейти на новую созданную вкладку, как показано на рисунке:

4) Нажать вкладку "Добавить новую" и указать язык формы по умолчанию, или выбрать нужный

5) Указываем имя контактной формы и нажимаем сохранить.

6) Теперь у нас появился шорткод, который уже можно скопировать и вставить в пост или сайдбар для того, чтобы вывести форму - contact-form-7 id="1252" title="Форма номер 1" (надо взять в квадратные скобки как на рисунке).

7) Вот как то так выглядит наша форма:

Конечно не очень красиво, но никто не мешает создать свои стили или сделать свою форму и туда вносить вставки.

Как вывести Contact Form 7 в произвольное место шаблона

В п.6 пошаговой настройки я показывал вам, как можно взять шорткод кода CF7 и далее описал что этот код можно выводить в виджет или в пост, страницу. В дополнение, хочу сказать, что вы можете вывести Contact form 7 в любое произвольное место шаблона. Для этого следует вставить вот такой несложный код:

Вот и все, если вы все сделали правильно, то получите вывод Contact Form 7 в произвольное место шаблона WordPress.

Настройка полей ввода Contact Form 7

Благодаря ему, у вас дополнительно появятся такие боксы как:

Настройка ответа reply-to для contact form 7

В новой версии плагина CF7 4.4 и выше, разработчик рекомендует вводить в поле from (вот оно на скине ниже)

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

Как сделать ответ пользователю с почтовика?

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

Решение этой проблемы есть и как всегда простое. Вам нужно в поле Additional Headers добавить код:

Reply-To:

Разумеется your-email-sh нужно заменить на свой шорткод почты. Смотрите скин ниже:


Теперь, когда вам придет письмо с обратной связи вордпресс, вы сможете нажать в почтовике ответить и ваш ответ будет отправлен на правильный e-mail.

Если после этий действий вы столкнулись с проблемой - стоить прочесть пост перейдя по ссылке. Там описанные основные проблемы и причины траблов в плагине Contact Form 7.

На этом все. Надеюсь вам стало понятно как делается настройка плагина и его макетов.

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

  1. Возможности Contact form 7
  2. Установка и настройка плагина
  3. Два варианта защиты от спама – фильтр akismet и captcha
  4. Размещение контактной формы во всплывающем окне
  5. Несколько всплывающих окон с разными формами на одной странице

Возможности плагина

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

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

Одним словом, плагин мегафункциональный.

Если вас до сих пор волнует вопрос «делать или не делать форму связи?» (можно обойтись простым размещением контактных данных на нужных страницах), то я скажу однозначно – делать стоит.

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

Во-вторых, контактную форму можно настроить и это позволит вам получать письма стандартного образца – в них будет проще ориентироваться. Например, вы можете поставить стандартный заголовок для сообщения «Заказ» и все письма со страницы заказов будут приходить с таким заголовком.

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

В-четвертых, это просто стильно и современно.

Установка и настройка плагина Contact form 7

Плагин есть в общей базе wordpress, поэтому нет необходимости искать где-то его файлы, скачивать их себе и потом закидывать на хостинг. Все делается проще – через админку wordpress входите в раздел плагины, набираете в поле для поиска «Contact form 7» и устанавливаете его. Если вы никогда плагины не ставили, то подробная инструкция как установить плагин есть тут.

Настройка плагина Contact form 7

Настройка плагина состоит из двух этапов.

Первый – это настройка конкретной формы. Разных форм может быть много, каждая из них может содержать свой набор полей. Одним словом, под каждую задачу и каждую страницу на сайте вы можете отдельно создать форму обратной связи, wordpress это позволяет – их список будет храниться в базе плагина.

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

Итак, поехали.

Для начала в левом меню панели администратора находим вкладку Contact form 7. Под ней всплывет меню с двумя пунктами – «Формы» и «Добавить новую».

Пока у нас нет готовых форм, поэтому, переходим в раздел «Добавить новую». Там откроется страница, предлагающая выбрать язык, и там же указан язык по умолчанию. Просто нажимаем синюю кнопку «Добавить новую».

Настройка формы разделена на отдельные блоки. Рассматривать их я буду по порядку.

Блок «Название формы»

Первый блок отвечает за название вашей формы – поставьте курсор на надпись «Без названия» и введите нужное вам имя. Это название будет отображаться только вам в списке контактных форм плагина, так что делайте его понятным для вас, чтобы в будущем не запутаться во всем многообразии.

Блок «Шаблон формы»

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

Звездочками помечены поля обязательные для заполнения. Если такое поле оставить пустым, то сообщение не будет отправляться.

Расположение полей можно настраивать с помощью обычной html разметки.

Что касается настройки самих полей, то вы можете удалить ненужные и добавить те, которые вам потребуются. Если вы не хотите, чтобы тему письма вносили вручную – просто удалите соответствующий блок.

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

Выберите нужный элемент и настройте его параметры. Плагин на русском, поэтому все настройки интуитивно понятны.

Первый чекбокс указывает на обязательность или необязательность поля (он добавляет звездочку).

После настройки поля у вас появятся 2 шорткода:

  • «Скопируйте этот код и вставьте его в шаблон формы слева» - этот код вставляется в код формы аналогично со всеми остальными;
  • «И вставьте следующий код в шаблон письма ниже» – этот код понадобится нам для оформления письма в следующем блоке.

Читайте также: Какой хостинг лучше выбрать для сайта?

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

Блок «Письмо»

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

Наша задача включить в письмо всю информацию.

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

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

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

Поле дополнительных заголовков содержит тег «Reply-To: » для того, чтобы при ответе на письмо, полученное с вашего блога вы отсылали сообщение на на блог, а на тот адрес, который указывал отправитель письма в поле формы . Менять это поле не стоит.

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

В конце указывается сайт, с которого отправлено письмо.

Если вы вносили в форму какие-то дополнительные поля, не установленные по умолчанию, то в шаблоне письма не забудьте добавить соответствующий тег. Он был вам дан в блоке «Шаблон формы», там, где вы генерировали соответствующий тег (поле «И вставьте следующий код в шаблон письма ниже»).

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

Блок «Письмо 2»

Если вы хотите, чтобы отправленное вам сообщение получал кто-то еще, то можно поставить галочку в этом блоке.

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

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

Блок «Уведомления при отправке формы»

В этом блоке можно настроить сообщения, которые видит пользователь, после того, как он нажмет кнопку отправить сообщение. Хотите что-либо поменять – пожалуйста, я оставил все как есть.

Активация формы

После того, как вы заполнили все поля, вернитесь в начало к блоку «Название формы» и нажмите кнопку «сохранить», расположенную справа.

Плагин поместит созданную вами форму в список действующих и присвоит ей специальный код примерно такого вида:

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

Борьба со спамом - Akismet и Captcha

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

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

Избавиться от спамеров можно двумя способами:

  1. Поставить обязательную капчу (это можно сделать дополнительным плагином - Really Simple CAPTCHA).
  2. Воспользоваться антиспамерским плагином для wordpress – Akismet.

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

Использование плагина Akismet удобнее тем, что он самостоятельно анализирует вводимые данные (имена, email адреса, ссылки) и на основании наработанной базы делает выводы о спамности или неспамности сообщения.

Кроме того, akismet стоит на большинстве wordpress сайтов для защиты от спама в комментариях к статьям. Значит, при его использовании не потребуется устанавливать дополнительные плагины и создавать лишнюю нагрузку на сайт.

Защита от спама с помощью Akismet

1. Устанавливаем плагин Akismet на ваш сайт и активируем его.

2. Добавляем в теги контактной формы дополнительные данные:

  • в поле с именем автора дописываем akismet:author
  • в поле с email отправителя письма akismet:author_email
  • в поле для адреса сайта akismet:author_url

Должно получиться вот так:

После сохранения, контактная форма должна блокировать все сообщения, отправляемые спамерами. Проверить работу фильтра можно с помощью специального тестового имени “viagra-test-123? - при его вводе должно появляться сообщение об ошибке.

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

Читайте также: Лучшие плагины для создания мобильной версии WordPress сайта

Защита от спама с помощью Really Simple CAPTCHA

Если вы обнаружите, что Akismet вас не устраивает (пропускает много спама или блокирует нужные сообщения), то вы можете подключить капчу. Для этого установите плагин Really Simple CAPTCHA.

Открываем для редактирования нужную контактную форму

В списке тегов выбираем Captcha. В настройках тегов можно выбрать размер картинки с символами, в остальном ничего менять не стоит. В нижней части настроечного окна появятся 2 тега, один отвечает за вывод картинки, второй выводит поле для ввода данных с этой картинки.

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

Размещение формы обратной связи во всплывающем окне

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

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

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

Делается это с помощью еще одного плагина - Easy FancyBox.

1. Установка плагина

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

Несколько разных всплывающих форм на одной странице

Иногда возникает необходимость разместить на сайте несколько форм с разными настройками и полями.

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

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

  1. Меняется ссылка, параметру href присваиваете значение #contact_form_pop_2
  2. Изменяете идентификатор id на то же значение #contact_form_pop_2

Для второй формы получится такой код:

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