Форма обратной связи wordpress. Плагин Contact Form 7

Добрый день, уважаемые посетители! Вы создаёте свой первый сайт на движке Вордпресс и решили что вам необходима форма обратной связи wordpress. И это верное решение. Ведь неважно какой тематики, какого типа сайт — важно наладить общение со своими посетителями. Это позволит в дальнейшем возвращаться на ваш ресурс ещё не раз. Форма обратной связи — это важный элемент на сайте.

Создать форму обратной связи на сайте можно двумя способами. Писать код формы самостоятельно. Но для этого должны быть знания в языке программирования [link]HTML[/link] и [link]CSS[/link]. А можно и попроще, без этих знаний. Благо, wordpress позволяет использовать плагины для решения различных задач.

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

Форма обратной связи wordpress плагином

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

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

Активируете плагин. Плагин Contact Form 7 полностью переведен на русский язык, имеет интуитивно понятный интерфейс. Он лёгок и не загружает сайт. После активации в админке появится пункт меню Contact Form 7 с несколькими подпунктами.

Плагин Contact Form 7

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

В первом содержится стандартная форма от производителя, как говорится, и формы которые создадите вы. Можно создавать неограниченное количество форм и все они будут отображаться тут же списком. Форма представляет собой shortcode (шорткод). Его можно вставить в любое место сайта: статью, страницу, виджет. На странице этот шорткод развернётся в виде формы.

Установка формы обратной связи на страницу

Для установки формы на страницу нужно выполнить несколько шагов.
  1. Перейдите в подпункт Формы.
  2. Копируйте шорткод.Шорткод плагина contact form 7
  3. В админке перейдите на страницу куда собираетесь вставить форму. Переключитесь в режим Текст. В нужное место вставьте шорткод.Вставить шорткод на страницу
  4. Сохраните изменения.

Стандартная форма на сайте будет выглядеть так.

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

Опробуйте работу формы. Письмо будет отправлено на e-mail администратора.

Читайте «Что нужно сделать сразу после установки WordPress? Настройка WordPress«

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

Редактирование формы Contact Form 7

Как уже говорил можно создавать множество форм. Жмите Добавить новую. Откроется форма редактирования. Даёте название и приступаете к редактированию.

Редактирование формы

В верхней части много кнопок, нажав на которые добавляете те или иные элементы в форму, (после копирования и вставки соответствующих тегов в текстовой области). Например, если хотите убрать тему сообщения, а добавить сайт, надо сделать следующее.
  • Жмёте URL
  • Копируете тег
  • Вставляете вместо тега [text your-subject]
  • Получаете следующий результатРедактирование формы 1

Выпадающее меню в Contact Form 7

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

Выпадающее меню в Contact Form 7

Отметив атрибут id и атрибут класса впоследствии сможете оформить поля с помощью CSS.

Интеграция reCaptcha в WordPress

Третий подпункт Интеграция предназначен для борьбы со спамом. При желании можно настроить сервис reCaptcha от гиганта Google. Очень простая форма в которой нужно подтвердить, что вы не робот. Выглядит она вот так.Форма reCAPTCHA

Чтобы иметь возможность пользоваться сервисом переходите на [link]официальную страницу reCaptcha[/link]. Регистрируете свой сайт.ReCaptcha

Вам дают два ключа,

ключ reCAPTCHA
которые нужно вставить в соответствующие поля плагина. Теперь во время редактирования формы надо перейти на вкладку reCaptcha, скопировать тег [recaptcha], и вставить в нужное место формы.

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

Антиспам вопрос-ответ

Сгенерированный тег вставляете в форму.

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

Попробуйте различные варианты и вы создадите лучшую форму обратной связи на вордпресс в интернете!

Желаю удачи!

С уважением, Павел Коновалов

Комментарии 10

  • Абсолютно с Вами согласен. Мне нравится Ваша идея.

  • Кто ищет тот всегда находит

  • День добрый.
    Спасибо за ресурс.

  • Один раз сильно обжегся на Contact Form, после того как узнал, что формы мои полгода не работают на сайте. А я думал, что это пользователи и спамеры ничего не пишут 🙂 Пришлось искать другой плагин, более стабильный. Остановился на этом плагине https://ru.wordpress.org/plugins/ucalc/ и уже как года 2 использую его.

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

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

    • Глеб, конечно, есть альтернатива любому плагину Вордпресс. Каждый вебмастер выбирает тот, который отвечает его потребностям.

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

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

 

Этот сайт использует Akismet для борьбы со спамом. Узнайте как обрабатываются ваши данные комментариев.