Добавляет на сайт страницу с политикой конфиденциальности. Также, добавляет под Контакт Форм 7 согласие на обработку персональных данных. Плагин предназначен только для русскоязычных сайтов. При входе пользователям показывает оповещение о использовании сайтом cookies. Подходит для 152ФЗ.
По вопросам работы плагина пишите на это почту: [email protected]. Через онлайн консультант на нашем сайте консультации не даем.

Установка

1. Установите плагин.
2. Заполните обязательные данные о компании.

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

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

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

1.28 Проверка совместимости с WP 5.0. Добавлена скрытие заголовка из текста политики
1.27 Проверка наличия кук для плашки, которая выплывает снизу при входе на сайт переведено на js
1.26 Добавлен rel=nofollow ссылкам плагина
1.25 Добавлен текст соглашения под стандартной формой комментирования
1.24 Исправлена ошибка в Java scriptе
1.22 Исправлены мелкие баги в админке и вывод текста имени кнопки под contact form 7 на странице
1.21 Класс container, которым обрамлен текст политики, заменен на container-ppcf7
1.2 Добавлен класс к тегу

p> под формами
1.1 Добавлена опция показать/скрыть ссылку на политику конфиденциальности в подвале
1.01 Убран лишний тег p в сообщении cookie
1.0 Первая версия в репозитории

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

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

Одним из наиболее широко используемых плагинов для создания форм обратной связи является Contact form 7. Он быстро набрал популярность благодаря своей простоте в настраивание содержимым формы. Плюс поддерживает фильтрацию спама и позволяет установить CAPTCHA с помощью дополнительного плагина Really Simple CAPTCHA. Также плагин поддерживает технологию Ajax, что в обработке выполнения запроса веб-страница не перезагружается.

После установки и активации Contact form 7 в панели управления появиться новая вкладка для управления форм. Чтобы найти с ним общий язык долго возиться не придётся, плагин мультиязычный и русский имеется в том числе. Контактная форма стилизуется в зависимости от установленной вами темы, но со знаниями CSS возможно отредактировать на свой вкус.

Пример формы.

2. Form Maker

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

Пример формы.

3. Fast Secure Contact Form

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

Пример формы.

4. Visual Form Builder

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

Окно настроек.

Пример формы.

5. Slick contact forms

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

Пример формы.

Contact Form 7

• Все поля (теги) формы
• Как сделать обязательным одно из полей: почта или телефон
• Conditional Fields for Contact Form 7 аддон
• Contact form 7 Custom validation аддон

В предыдущей статье мы ознакомились с плагином Contact Form 7 и его настройками. А здесь, будут подробно рассмотрены все поддерживаемые типы полей (теги шаблона формы) и параметры каждого из них, а также стили (css классы) элементов формы. Это неофициальная документация ко всем тегам шаблона формы Contact Form 7.

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

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

Также каждый тег (поле) имеет свои опции (атрибуты тега). Опции тега указываются после названия и имени поля. Для примера, добавим атрибут class для предыдущего поля text:

Синтаксис тега шаблона (поля) формы:

Атрибуты тегов (полей)

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

Атрибуты, которые можно применить только к конкретному тегу формы, будут указаны отдельно для каждого тега.

* Знак * сразу после типа поля делает поле обязательным для заполнения.
Пример: id(строка) Название идентификатора. css атрибут id, используется для оформления поля.
Пример: id:foo class(строка) Название класса. css атрибут class, используется для оформления поля.
Пример: class:bar
Можно указать несколько классов: minlength и maxlength(число)

Это HTML5 атрибуты, которые ограничивают ввод символов в поле, как по нижнему порогу (минимальному), так и по верхнему (максимальному). Пользователь не сможет ввести в поле меньше знаков (minlength) или больше знаков (maxlength), чем определено этими значениями.

Для minlength , если введённый текст будет меньше этого значения, то пользователь получит предупреждение "Поле слишком короткое". И наоборот для maxlength .

Примеры:
minlength:10 -
maxlength:90 -
оба сразу -

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

Данные параметры поддерживают следующие типы полей: text , textarea , email , url , tel , quiz .

Существует старая запись этих параметров:

Параметр maxlength в явном виде приоритетнее, поэтому если дописать maxlength:150 , то 140 будет переписано на 150.

Size(число) Ширина текстового поля, которое определяется числом символов моноширинного шрифта. Может быть переопределено в CSS стилях с помощью атрибута width.
Пример: size:50 -
По умолчанию: 40 default(строка/число)

Значение поля по умолчанию.

Пример: default:значение.

Если пользователь, заполняющий форму, авторизован, то по умолчанию можно подставлять значение взятое из данных его профиля. Например, если указать атрибут default:user_email - , то в поле автоматически подставиться значение - «email текущего пользователя», который просматривает форму...

Остальные специальные поля атрибута default:

default:post_meta - получит значение метаполя ключ которого будет равен имени поля. Например: выведет поле формы в значении которого будет выставлено значение метаполя записи mymeta_key

default:get - выставит значение GET параметра c ключом равным имени поля: - http://example.com/?mykey=значение

default:post - выставит значение POST параметра c ключом равным имени поля: - в POST передаем данные mykey=значение.

default:shortcode_attr - выставит значение атрибута шорткода с ключом равным имени поля. Например тег шаблона формы такой: , тогда в шоркоде самой формы при вызове в контенте записи указываем атрибут mykey: . Подробнее читайте ниже.

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

Add_filter("shortcode_atts_wpcf7", "my_shortcode_atts_wpcf7", 10, 3); function my_shortcode_atts_wpcf7($out, $pairs, $atts){ if(isset($atts["mykey"])) $out["mykey"] = $atts["mykey"]; return $out; }

Для checkbox, radio и select:

• default:номер - default:2 - выберет второй элемент списка...
• default:номер_номер - default:2_3 - выберет второй и третий элемент списка (для мульти-селектов и чекбоксов)...

Подробнее про default и его варианты, читайте в конце статьи.

Placeholder или watermark(строка)

Текст который будет показан в атрибуте placeholder.

Эту опцию нужно использовать в конце всех опций тега шаблона: , а не

Можно использовать watermark вместо placeholder - это синоним (алиас) атрибута.

Akismet(строка)

Спам защита. Требует установленного и активированного плагина Akismet .

• akismet:author -
• akismet:author_email -
• akismet:author_url -

Как это работает? При отправки данных, значения указанных полей будут обработаны на сервере akismet и если они не пройдут проверку, то письмо не будет отправлено, а пользователь увидит ошибку:

Сообщение исчезнет при фокусе на любом из полей.

Теги шаблона формы (поля)

Ниже описаны все теги плагина, которые можно использовать в шаблоне формы. Такие теги превратятся в input , textarea и select элементы HTML.

К текстовым полям относятся типы: text , email , url , tel , textarea , а также тег count тесно связан именно с текстовыми полями.

К числовым полям относятся два типа: number и range . Это HTML5 поля, потому старые браузеры их не поддерживают, взамен отображая текстовое поле (text).

text

Поле для текста в одну строку.

Поддерживаемые опции (атрибуты):

• class
• minlength и maxlength
• size
• placeholder
• default - можно использовать: user_login, user_first_name, user_last_name, user_nickname, user_display_name
• akismet:author

email

Поле предназначено для ввода email.

Поддерживаются атрибуты:

• class
• minlength и maxlength
• size
• placeholder
• akismet:author_email
• default:user_email или default:любая@почта.ру

url

Поле для ввода интернет адреса (URL).

Поддерживаются атрибуты:

• class
• minlength и maxlength
• size
• placeholder
• akismet:author_url
• default:user_url или default:значение

tel

Поле для ввода номера телефона.

Поддерживаются атрибуты:

• class
• minlength и maxlength
• size
• placeholder

textarea

Поле для ввода многострочного текста.

Поддерживаются атрибуты:

• class
• minlength и maxlength
• placeholder
• (cols)x(rows) - где cols - ширина поля в символах, а rows - высота поля в строках текста. Имеет 3 формата: (cols)x(rows) , (cols)x и x(rows) .

Для textarea значение поля можно указать двумя способами:

2. Текст по умолчанию...

Если в textarea будут html теги, то после отправки формы вы, возможно, получите 500 ошибку сервера!

count (счётчик символов)

Тег count позволяет установить счетчик, когда нужно показать пользователю, сколько введено символов или сколько символов осталось до максимального значения (если параметр maxlength).

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

Тег счётчика можно использовать в любом месте шаблона формы.

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

Тогда делаем так:

Поле ограничено - минимум 10 и максимум 140 символами. В данном случае счётчик будет показывать сколько всего введено символов.

Иногда удобнее показать сколько символов осталось ввести, ведь пользователь не знает об ограничении по максимуму. Для этого в теге нужно указать опцию down - .

number

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

Поддерживает атрибуты:

• class
• placeholder
• min
• max

range

Ползунок для выбора чисел в указанном диапазоне.

Поддерживает атрибуты:

• class
• placeholder - отображаются только в браузерах, не поддерживающих данный тип поля и отображающих взамен текстовое поле.
• min - Устанавливает нижнее значение для ввода числа: min:20
• max - Устанавливает верхнее значение для ввода числа: min:100
• step - Устанавливает шаг изменения числа для ползунков и полей ввода чисел: min:5

checkbox и radio

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

Поддерживаемые атрибуты:

• default - Значение поля по умолчанию, к примеру default:2 означает, что при отображении поля второй вариант ответа будет уже выбран. Для чекбоксов можно указать несколько значений подобным образом default:1_2_3

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

  use_label_element - Оборачивает чекбокс или радио-кнопки в label, что позволяет делать выбор элемента кликнув по его названию.

  exclusive - Указав этот параметр, у чекбокса можно будет выбрать только 1 элемент. Данный функционал работает на основе JavaScript. Радио-кнопки не поддерживают опцию в силу своей специфики.

  free_text - Позволяет добавить к последнему элементу текстовое поле. Оно становится доступным к заполнению при выборе последнего элемента и пользователь может дополнить свой ответ.

• data - Получает значение из листа со странами мира, к примеру data:countries .

China India San Marino

select

Позволяет выбрать варианты ответа из выпадающего списка. Может использоваться в двух вариантах:

Атрибуты:

• class
• default - default:2 или default:2_3_4
• multiple - Позволит выбрать несколько вариантов ответа
• include_blank - Добавит первым вариантом ответа строку "- - -"
• first_as_label
• data
• items - варианты ответов

Пункт 1 Пункт 2 Пункт 3

date

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

Атрибуты:

• class
• placeholder
• min - Нижнее значение возможной даты, например min:2016-01-01 . Поддерживается относительный формат даты, например today+10days , today-2weeks и так далее.
• max - Верхнее значение возможной даты, например min:2017-01-01 . Поддерживается относительный формат даты, как и у min .
• step - Шаг изменения даты в днях, например step:3 . Если нижнее значение 2016-01-01 и шаг 3, то при следующем шаге отобразиться дата 2016-01-04 и так далее.

При вставке тега в шаблон письма, на почту придет дата в формате YYYY-MM-DD (2016-12-25) - это не наглядно. Поэтому можно указать более наглядный шаблон, для этого используйте конструкцию [_format_{field name} "{date format}"]

[_format_your-date "D, d M y"]

reCAPTCHA (защита от спама)

Contact Form 7, начиная с версии 4.3, в связке с сервисом reCAPTCHA позволяет бороться со спамом. Чтобы пользоваться reCAPTCHA нужно иметь аккаунт в Google, где можно получить ключи для использования API сервиса.

Чтобы получить эти ключи, нужно:

1. Зайти в админку reCAPTCHA .
2. Зарегистрировать сайт.
3. Получить ключ сайта и секретный ключ (это два разных ключа: ключ сайта может быть один, а секретных ключей много).

Атрибуты:

• class
• theme - Цветовая схема виджета. Может быть dark или light (по умолчанию).
• size - Размер виджета. Может быть compact (компактный) или normal (по умолчанию).

Теперь в шаблоне формы используйте тег .

Quiz (вопрос-ответ)

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

Атрибуты:

• class
• size - Размер поля и его длина. Одно из значений может быть опущено.

На какой планете Вы живёте?

Из примера видно, что вопрос и ответ разделяется знаком | . Вопрос и ответ можно писать абсолютно любой, например математический:

Можно указать несколько пар вопрос-ответ, вопрос будет выбран случайно каждый раз при показе формы:

Для этого поля можно указать параметры minlength и maxlength:

При создание тега quiz с несколькими вопросами при помощи генератора пишите каждую пару вопрос-ответ с новой строки.

hidden

Скрытое поле - не видно пользователю. Может хранить в себе ценную информацию. Информация может быть добавлена с помощью Javascript или создана с помощью опции default .

Атрибуты:

• class
• default - Сюда можно передать параметр, который будет преобразован по определенному правилу. Подробнее читайте в описании атрибута (опции в начале статьи).

submit

Кнопка отправки данных формы (сабмита). При нажатии на эту кнопку происходит отправка всех данных формы на сервер.

Атрибуты:

• class

Можно указать текст кнопки:

Пример использования всех поддерживаемых параметров:

ajax-loader

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

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

В этом случае мы потеряем тег , потому что он добавляется через JS, после элемента с классом wpcf7-submit - обычно такой класс имеет стандартная кнопка сабмита.

Чтобы обойти это ограничение, можно просто добавить этот класс к нашему HTML коду кнопки:

Все. Теперь тег будет добавляться и работать как надо.

Или можно добавить тег прямо в шаблон формы.

acceptance (я принимаю ваши условия)

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

Атрибуты:

• class
• invert - Параметр, делающий чекбокс сразу с флажком, но чтобы отправить форму пользователю надо его убрать.
• default - Делает по умолчанию чекбокс сразу с флажком, если указать on , пример default:on , по умолчанию же default:off .
• optional - поле становится не обязательным.

Разрешаю использовать моё имя в комментариях.

Разрешаю использовать моё имя в комментариях.

Поле является чекбоксом, который обрабатывается с помощью такого JavaScript:

This.find(".wpcf7-acceptance").click(function() { $(this).closest("form").wpcf7ToggleSubmit(); });

Изначально у кнопки отправки формы присутствует атрибут disabled="disabled" . Т.е. если чекбокс не активный, то кнопка отправки формы тоже неактивна, а значит и отправить её нельзя. При установки флажка в чекбоксе, скрипт убирает этот атрибут и кнопка становится активной.

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

Acceptance_as_validation: on

Так, если пользователь не поставит флажок, получит уведомление:

file (загрузка файлов)

С помощью этого поля можно разрешить пользователям прикреплять к письму свои файлы.

Добавление такого функционала состоит из двух этапов:

1 этап - добавление полей для загрузки файлов в форму

Атрибуты:

• filetypes - Тип файла, который разрешен для загрузки, например pdf, jpg и другие (полный список ниже), указываемые через разделитель | (прямая черта), если требуется указать несколько типов.

• limit - Ограничение загружаемого файла по размеру, например: limit:1048576 , limit:1024kb , limit:1mb . Вы можете использовать kb (килобайты) или mb (мегабайты).

Допустимые типы файлов: jpg, jpeg, png, gif, pdf, doc, docx, ppt, pptx, odt, avi, ogg, m4a, mov, mp3, mp4, mpg, wav, and wmv .

Макс размер файла по умолчанию: 1 MB (1048576 байт).

2 этап - добавление тега в шаблон письма

На 1 этапе было создано поле, у которого есть имя - your-file . Теперь используем тег с этим именем в шаблоне письма, но не в привычном поле "Тело письма", а в поле "Прикреплённые файлы".

В поле "Прикреплённые файлы" вставляете только тег с именем поля из шаблона формы.

• - правильно
• - неправильно

Если несколько полей для загрузки файлов, то в поле "Прикреплённые файлы" перечисляете их друг за другом без каких-либо разделителей: .

Локальные вложения

Contact Form 7, начиная с версии 3.5, поддерживает передачу локальных файлов в письмо. Для этого наряду со вставкой тегов в поле прикрепления файлов нужно передать путь к вашему файлу:

/home/you/dir/dir/dir/fantasticpicture.jpg uploads/2013/08/08/boringguide.pdf

Если указан не абсолютный путь, то будет рассматриваться относительный от папки wp-content .

Управление загрузкой файлов

После того, как пользователь загружает файл через контактную форму, Contact Form 7 проверяет следующие моменты:

1. Какие ошибки PHP произошли;
2. Тип файла и размер файла.

Если проверка прошла успешно, то плагин:

1. Перемещает загруженный файл во временную папку.
2. Прикрепляет файл к письму и отправляет его.
3. Удаляет файл из временной папки.

По умолчанию папка с временными файлами находится тут: wp-content/uploads/wpcf7_uploads . Может отличаться, если изменен путь к папке uploads .

Папка wpcf7_uploads создается автоматически. Но бывают случае, когда это невозможно - родительская папка uploads не имеет прав на запись. Тогда вам нужно:

1. Изменить права папки uploads.
2. Создать папку wpcf7_uploads в ручном режиме через ftp и т.д.

Также, можно вообще изменить путь к временной папке плагина. Для этого откройте файл wp-config.php в корне сайта и добавьте константу WPCF7_UPLOADS_TMP_DIR , в которой укажите полный путь до папки с временными файлами:

Define("WPCF7_UPLOADS_TMP_DIR", "/your/file/path");

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

response

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

Чтобы изменить это положение вставьте тег в то место шаблона формы, где должны быть уведомления:

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

Если не ввести имя, то форма отправлена не будет и нас известят об ошибке:

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

Помните, что этому правилу подчиняются все уведомления, поддерживаемые плагином (успешная отправка, спам и т.д.).

Спец. значения атрибута default

Получение значений по умолчанию по ситуации

Почти всем полям можно через атрибут default передать значение по умолчанию. Но что делать, когда надо передать динамические параметры? К примеру, с помощью GET запроса через URL.

Динамическое получение параметров работает на основе следующих опций тега:

Default:get HTTP GET переменные. Ключ параметра должен совпадать с именем поля формы. default:post HTTP POST переменные. Ключ параметра должен совпадать с именем поля формы. default:post_meta Значение произвольного поля записи в которой находится форма. Имя произвольного поля должно совпадать с именем тега. default:user_(поле пользователя) Речь идет о: default:user_email или default:user_nickname . Полный список таких значений приведен в след. пункте.

Пример тега текстового поля на основе GET запроса:

Пусть у нас есть страница contact , обратимся к ней с передачей GET параметра:

Http://example.com/contact/?your-name=Дмитрий

В результате значение нашего поля будет автоматом "Дмитрий".

Ещё пример: передача UTM меток в форму

Дефолтное значение из нескольких источников

Также, можно передать несколько мест, откуда хотелось бы получить значение:

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

Получение значений по умолчанию для зарегистрированного пользователя

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

Для этого нужно использовать специальные значения атрибута default для авторизованного пользователя. Рассмотрим все возможные варианты:

• default:user_login - Логин пользователя
• default:user_email - Электронная почта
• default:user_url - Адрес сайта
• default:user_first_name - Имя
• default:user_last_name - Фамилия
• default:user_nickname - Ник
• default:user_display_name - Отображаемое на сайте имя
• default:user_description - Описание (биография).
• default:user_* - где вместо * можно указать любое значение из данных пользователя (см. get_userdata()). Если оригинальные данные пользователя (ключ) начинаются не с user_ , то их нужно начать с user_ . Допустим, у юзера есть метаполе vk и нам нужно указать тут значение этого метаполя. Тогда пишем так: default:user_vk

Ваше имя: Ваш E-mail:

Ещё один пример

Один из зарегистрированных пользователей на сайте решил воспользоваться формой. Логично сразу подставить его имя в поле «Имя», ведь оно известно. Используем атрибут default:

Теперь, когда авторизованный пользователь зайдет на страницу с формой - его отображаемое имя (display_name) будет поставлено в поле your-name автоматом. А если на эту же страницу зайдет неавторизованный пользователь, то он увидит плейсхолдер "Введите ваше имя".

Получение значений по умолчанию через атрибуты основного шоркода CF7

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

В этом случае, нужно использовать опцию тега default:shortcode_attr , которая «говорит» плагину получить в качестве дефолтного значение одноименное (с именем поля) значение атрибута шотркода.

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

Однако это еще не все! Как мы знаем для любого шорткода в WordPress ему указывается белый список атрибутов, которые в нём можно использовать. В этом случае, про наш новый атрибут шорткода contact-form-7 WP ничего не знает, поэтому его нужно добавить в белый список. Делается это через хук плагина:

Add_filter("shortcode_atts_wpcf7", "custom_shortcode_atts_wpcf7", 10, 3); function custom_shortcode_atts_wpcf7($out, $pairs, $atts) { if(isset($atts["myemail"])) $out["myemail"] = $atts["myemail"]; return $out; }

Данный код вставляется в functions.php.

Теперь при заходе на страницу с формой в поле email будет подставлено значение [email protected] .

Flector 5

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

1 Распаковываем архив.

2 Копируем папку contact-form-7 в /wp-content/plugins/ .

3 Заходим в админку блога на вкладку "Плагины " и активируем плагин.

При своей активации плагин создает отдельное меню в админке блога под названием "", также при этом создается дефолтная контактная форма, которую вы можете увидеть в "Contact Form 7\Формы ":

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

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

Для вывода этой простейшей формы вам понадобится всего пара минут. И именно из-за такой легкости добавления контактной формы многие пользователи и любят этот плагин.

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

Откроется вот такая начальная страница добавления формы:

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

Заголовок не имеет никакого значения, он нужен только для того, чтобы вы сами не запутались в своих собственных формах. Установили название своей формы, нажали на кнопку "Сохранить ", получили в итоге "код вставки":

Теперь можно вставить предложенный код в любую свою запись или страницу (в режиме "Текст", конечно), чтобы вывести в ней контактную форму. Однако она ничем не будет отличаться от формы по умолчанию, поэтому продолжим работать с конструктором форм. В правой части страницы конструктора расположена кнопка "Сгенерировать тэг ", клик на нее выдаст:

Выберем, к примеру, номер телефона. Откроется такое окно:

Собственно, тут можно вообще ничего не менять. Размеры, классы и прочее это второстепенные опции и в большинстве случаев вам им редактировать не надо. Однако, опция "" может быть полезна в качестве подсказки посетителям, как именно надо заполнять это поле.

Например, задаем такие значения:

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

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

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

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

Сохраняем код формы и получаем в итоге вот такую контактную форму:

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

1 Текстовое поле.

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

2 E-mail.

Используется только для ввода e-mail адреса.

3 URL.

4 Номер телефона.

Используется только для ввода номера телефона (цифры и дефизы).

5 Число (spinbox).

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

6 Число (slider).

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

7 Дата.

Используется только для ввода даты.

8 Текстовое поле.

В русском переводе данный тэг тоже получил название "Текстовое поле", но в терминологии HTML это textarea, что, по сути, обозначает лишь увеличенное текстовое поле. Используется для ввода текста сообщения.

9 Выпадающее меню.

Используется для выбора пункта (или нескольких пунктов) из выпадающего меню. Можно использовать для чего угодно – от вопроса о цвете заказываемого товара до выбора пола человека.

10 Checkboxes.

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

11 Radio buttons.

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

12 Acceptance.

Используется для согласия с условиями.

13 Вопрос.

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

14 CAPTCHA.

Используется для вывода полноценной капчи. Для использования данного тэга необходима установка плагина Really Simple CAPTCHA . Капча вполне читаемая, а поэтому легко пробивается продвинутыми спам-ботами вроде Хрумера.

15 Отправка файла.

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

16 Кнопка отправки.

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

С тэгами, используемыми непосредственно в контактной форме, разобрались. Теперь рассмотрим, как эти самые тэги из контактной формы получить на свой email. Чуть ниже кода контактной формы в конструкторе находится шаблон отсылаемого вам письма и именно в нем вы должны сделать необходимые изменения. Это важно, так как неправильное заполнение этого шаблона не позволит вам узнать, что именно написал посетитель в вашей форме. В качестве примера возьму тэг номера телефона. Скажем, в вашей контактной форме он вставлен через такой код:

Значит, в шаблоне отсылаемого письма надо вставить такой код:

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

Тексты, которые выдает контактная форма можно также поправить в конструкторе форм в разделе "Сообщения":

Часто задаваемые вопросы по плагину :

1 Ошибка вида " ", как исправить?

Это значит, что либо указанная форма удалена, либо неправильно указан заголовок формы (title в коде вызова критичен для вызова формы).

2 В письме я вижу тэги вроде вместо текста, как исправить?

Это значит, что посетитель не заполнил данное поле. В таком случае, тэг не заменяется, а выводится, как есть.

3 Есть ли ограничения при выборе имени для тэга?

Есть. Если цикле WordPress используется имя "name", то вы не можете его использовать в качестве имени для тэга. Лучшим способом избежать проблем будет добавление префиксов для имен, вроде слова "your". С именем тэга проблем точно не будет.

4 Можно ли сообщить посетителю по email, что его форма была получена?

Можно. Используйте в конструкторе форм опцию "Адресат 2":

Данную опцию вполне можно использовать в качестве автоответчика.

5 Можно ли отправить заполненную форму по нескольким адресам?

Можно. Используйте в опции "Адресат" поле "":

Где [email protected] ваш дополнительный email, на который будет отослана копия заполненной посетителем формы (команда "cc" отправляет скрытую копию).

6 Можно ли вывести форму не в записи или странице?

Да. Вставьте код вызова формы в текстовой виджет.

7 Можно ли вывести форму напрямую кодом в файлах шаблона?

Да. Используйте код вида:

"" ) ; ?>

8 Форма не отсылается, выдается ошибка в красной рамке, как исправить?

Обратиться к вашему хостеру, возможно в PHP запрещен вызов функции mail().

9 При отправке формы выдается ошибка в оранжевой рамке, как исправить?

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

10 Поле для ввода email выглядит иначе, чем другие поля в форме, как исправить?

Плагин использует HTML5 код для ввода email-адреса ( вместо ), а подобный код зачастую не оформлен в старых шаблонах. Вам необходимо внести изменения в styles.css вашего шаблона, добавив туда необходимый код для селектора input .

11 Как в email вставить прикрепленный пользователем файл?

Использовать для этого специальное поле "Прикрепленные файлы:"

Действительно заслуживает вашего внимания. В отличие от многих других популярных плагинов он не заставляет вас покупать какую-нибудь Pro версию - все его возможности доступны сразу. Популярность плагина (свыше 19 миллионов скачиваний) вполне заслужена – при всей своей функциональности он чрезвычайно прост в настройке и доступен даже для начинающих пользователей движка WordPress .

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

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

Автор плагина: Takayuki Miyoshi
Рассматриваемая версия: 3.9.1 от 31.07.2014
Текущая версия: 5.1.4 от 04.08.2019
Совместимость с версией WordPress: 4.9 и выше
Активных установок плагина: 5 000 000+
Скачать плагин версии 5.1.4 (всего скачено 121 112 956 раз)

Понравился пост? Подпишись на обновления по или

В данной статье рассмотрим как сделать форму обратной связи на сайте при помощи плагина Fast Secure Contact Form. Защита от спама (!), легкие настройки, широкие возможности, красивая форма.

Fast Secure Contact Form - как сделать форму обратной связи

Форма обратной связи обязательно должна быть на сайте. Ее можно установить на странице "Контакты", "Обо мне", "О нас", "Услуги". Поисковые системы приветствуют интерактив и повышают сайт в поисковой выдаче. Если вас не интересует и вы не планируете зарабатывать на своем сайте, все равно установите форму обратной связи. Со временем у вас обязательно появятся постоянные читатели и партнеры. Предоставьте им возможность связаться с вами.

В сравнении с другими плагинами Fast Secure Contact Form не использует JavaScript, что снижает использование ресурсов веб-сервера (даже меньше, чем простой плагин Contact Form), защищает от спама при помощи плагина Akismet, который установлен в базовой версии WordPress, а главное (для девочек) можно сделать красивые формы обратной связи без особых знаний.

Плагин Fast Secure Contact Form на английском языке. Здесь вы найдете частичный перевод по настройкам и установке формы (версия 4.0.32) на сайт WordPress (совместим с версией 4.1).

Удалите внешние ссылки

После установки и активации плагина, удалите ссылку на страницу автора плагина:

Плагины - Fast Secure Contact Form - Изменить - файл si-contact-form.php (в предыдущих версиях - si-contact-form-display.php)

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

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

Сохраните сделанные строки при помощи синей кнопочки Save Changes и перейдите к следующем настройкам .

Если у вас остались вопросы как сделать форму обратной связи Fast Secure Contact Form, задавайте вопросы в комментариях. Постараемся на них ответить.