Красивая своя формы обратной связи вордпресс. Обзор бесплатных и красивых форм обратной связи WordPress с капчей. Зачем нужна форма обратной связи

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

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

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

Contact Form 7 – это наиболее популярный (сейчас насчитывается более чем 12 тысяч скачиваний, и эта цифра продолжает расти) WordPress-плагин контактной формы. Плагин может похвастаться AJAX-отправкой, встроенной , Akismet-спам-фильтром и возможностью загружать файлы. Плагин совершенно бесплатный и легко кастомизируется с помощью простого HTML

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

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

Fast Secure Contact From – это еще один популярный плагин, который уже был скачан более 3.5 миллионов раз. Он позволяет владельцам блогов легко создавать и добавлять контактные формы на WordPress-сайты. Вы так же можете использовать форму, чтоб посылать запросы-приглашения к обычному или видео-звонку.

У плагина есть админ-интерфейс, с помощью которого вы можете создать неограниченное количество форм и посматривать их привью. Используя капчу и Akismet Fast Secure form, блокирует атаки, основанные на наиболее популярных спамерских тактиках.

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

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

Contact Form by Contact ME

Contact Form – это бесплатный в базовом функционале плагин, но он обязывает вас зарегистрироваться на сайте contactme.com. Регистрация совершенно бесплатная и не требует от вас никаких усилий. Разработчики плагина заявляют, что он на порядок лучше многих популярных плагинов контактной формы, включая contact form 7!

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

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

Изначально плагин FormCraft был создан и развивался только в премиум варианте. Относительно недавно авторы сделали отдельную, бесплатную версию — FormCraft — Form Builder .

Как и в премиум варианте, FormCraft — Form Builder позволяет легко и быстро конструировать разные формы в специальном и очень удобном drag & drop редакторе. Возможностей тут естественно поменьше, но для обычных пользователей вполне хватит.

Премиум версия FormCraft может похвастать настройкой скриптовой логики, авто сохранением, более чем 20+ дополнительными, настраиваемыми полями, popup и fly-in формами, експортом в CSV и прочими радостями.

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

Интерфейс Visual Form Builder приятно удивит вас, так как плагин позволяет создавать и управлять всем видами форм на вашем сайте из одного места. В один клик вы можете добавлять новые поля, реорганизовывать уже существующие, применить антиспам решение. Для того, чтоб изменить порядок полей вы можете воспользоваться технологией drag & drop.

Плюсы: Хоть Visual Form Builder и схож с другими плагинами контактной формы, перечисленными здесь, у него есть свои интересные «фишки» — возможность изменить порядок элементов простым перетаскиванием, экспорт вводимых данных в файле CSV, настраиваемые сообщения с подтверждением, форма отправки, которая поддерживает ввод множества email’ов.

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

nForms – WordPress Form Builder

Drag and Drop Builder предоставляет вам простой многоколоночный шаблон контактной формы, с Ajax отправкой и валидацией. Вы даже можете показывать форму, используя плагин, выводящий popup-окна. Есть возможность отобразить форму с помощью шорткода, обычной функции PHP или виджета.

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

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

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

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

Mapped Contact Form Pro WordPress использует другой алгоритм для показа формы на вашем веб-сайте. Это великолепное решение для бизнеса или компании, так как он может быть использован для обозначения на местности филиалов или офисов. Так же плагин идеален для тех, кто использует на своих сайтах карты .

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

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

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

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

Ninja Kick: WordPress Contact Form

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

Интересный плагин и сама форма. Подробнее можете прочитать в .

Подводим итог

Теперь самое время выбрать правильное расширение для вашего сайта. Contact Form 7 или FormCraft — Form Builder – это вероятно наилучшие решения для обычного блога, а для больших сайтов предлагающих разные сервисы и услуги, я бы посоветовал использовать — Gravity Forms или Ninja Forms. Любителям «выделится» великолепно подойдет — Ninja Kick: Contact Form.

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

Для создания формы обратной связи на 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 поля и ничего лишнего. Плагин отличается от остальных тем, что форма выводится через виджет и создает эффект плавающей или скользящей формы по странице. При нажатии она плавная появляется сбоку, сверху и т.д. зависит от выбранных вами настроек.

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

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

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

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

Для чего нужна форма обратной связи?

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

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

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

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

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

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

Панель обратной связи ManageWP

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

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

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

Добавление страницы обратной связи с помощью Page Builder

Если вы используете тему от Elegant Themes , то настроить страницу обратной связи будет для вас довольно просто. Мы будем использовать Page Builder из Elegant Themes , что позволит добавить форму всего за несколько шагов.

Для начала перейдите к пункту Страницы -> Добавить страницу панели администрирования WordPress . В результате будет создана новая страница. Назовите эту страницу «Обратная связь «. Сразу под заголовком вы увидите кнопку «Использовать Page Builder «.

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

Структура Page Builder

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

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

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

Ниже снова нажмите кнопку «Вставить модуль «. На этот раз перейдите в самый низ списка и выберите пункт «Контактная форма «. Опять же, вам будет выведена новая панель с несколькими опциями настройки формы. Во-первых, «Показать Captcha «, которая добавляет в конце контактной формы простой вопрос, чтобы блокировать спам-ботов.

Я хотел бы пока оставить это опцию отключенной, так как еще не получаю слишком много спама. В текстовое поле “Email ” введите адрес электронной почты, на который вы хотите получать сообщения обратной связи. Остальные настройки не являются обязательными. Вы можете добавить для полей заголовок, CSS -класс или ID :

Настройка контактной формы

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

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

Здесь, вы увидите список страниц, которые могут включаться или исключаться из меню навигации. Убедитесь, что напротив страницы «Обратная связь » стоит зеленая галочка. Если вы видите красный крестик, просто нажмите на него, чтобы вывести страницу с формой в меню и сохраните изменения.

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

Плагины формы обратной связи

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

Usernoise

Usernoise — это один из самых простых плагинов формы обратной связи. Плагин работает через добавление кнопки «Обратная связь» в боковой панели или нижней части вашего сайта.

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

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

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

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

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

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

Ninja Kick Contact Form

Ninja Kick Contact Form — это премиум плагин, очень похожий на Usernoise , но он добавляет несколько дополнительных функций и стилей.

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

Выезжающая форма

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

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

Ninja Kick Contact Form является платным плагином в основном из-за уровня настройки, который он позволяет. Вы можете выбрать одну из трех различных тем, и изменить цвета и стиль каждого аспекта представления.

Он также имеет встроенную защиту от спама, и является полностью адаптивным и мобильно-дружелюбным. Ninja Kick Contact Form стабильно работает, довольно прост и использует качественную анимацию.

Usersnap

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

За использование сервиса взимается определенная плата, в зависимости от того, на скольких ваших сайтах он реализован.

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

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

Скриншоты

Установка

1. Загрузите всю папку contact-form-7 в директорию /wp-content/plugins/ .
2. Activate the plugin through the Plugins screen (Plugins > Installed Plugins ).

You will find Contact menu in your WordPress admin screen.

Отзывы

1) Do not use 2) Do not use 3) Do not use The forms seem nice and straightforward, but are riddled with glitches. There are more than 1000 support requests; most are unanswered. File uploads fail without an explanation. Forms also fail with no explanation. There aren"t useful solution or error messages, just lots of frustration. If you don"t want to spend many hours of frustration only to later uninstall this plugin, don"t install it in the first place. Try something that actually works, like Everest.

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

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

Участники

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

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

5.1.7

• CSS: Adds an explicit LTR direction style rule for code inputs.
• Accessibility: Uses Error instead of ERROR in warnings.

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

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

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

Я постараюсь максимально подробно объяснить все этапы установки контактной формы, и в связи с этим урок получится достаточно длинным 🙂

Создание контактной формы в WordPress

В самом начале хочу заметить, что плагин Contact Form 7 русифицирован, и никаких проблем с ним у вас не будет. Как доказательство моих слов может выступать тот факт, что данный плагин скачали БОЛЕЕ 25 МИЛЛИОНОВ РАЗ!!!

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

1. Установите и активируйте плагин Contact Form 7 . Как устанавливать плагины вы можете .

2. После активации перейдите в Contact Form 7 -> Формы .

3. В открывшемся окне копируем строчку с кодом вставки.

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

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

Готово! Вы установили рабочую форму обратной связи на свой сайт!

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

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

Для этого нам нужно чтобы в форме были такие поля для заполнения:

• Имя (Обязательное поле для заполнения)
• Фамилия
• Телефон (Обязательное поле для заполнения)
• Поле с выбором удобного времени для звонка

После того как мы определились с полями, переходим к созданию формы:

1. Переходим в Contact Form 7 -> Добавить новую.

2. В открывшемся окне нажимаем кнопку «Добавить новую» . Если необходимо, выберите язык в выпадающем списке ниже. По умолчанию язык будет русским .

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

В самом верху страницу поле, в которое пишем название новой формы . В Шаблоне формы мы видим стандартные поля формы, которые создаются по умолчанию.

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

4. После того, как мы поверхностно ознакомились с структурой редактора, переходим к созданию нашей новой формы. Для этого нам нужно УДАЛИТЬ из шаблона формы все строчки кроме кнопки «Отправить», а в шаблоне письма удалить все полностью. После удаления у вас должно получится так:

5. Теперь нам нужно создать новые поля: Имя (обязательное), Фамилия , Телефон (обязательное), Удобное время звонка .

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

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

6. После того, как мы добавили поле для ввода имени, нажимаем «Сгенерировать тег» -> Текстовое поле и по аналогии создаем поле Фамилия и Телефон , копируя и вставляя код в шаблон формы и шаблон письма. Отличие только в том, что для поля Фамилия ставить галочку для обязательного заполнения не нужно.

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

7. Теперь создаем поле Удобное время звонка. Для этого нажимаем «Сгенерировать тег» и выбираем «Выпадающее меню» .

В поле Выбор пишем в строчку по одному варианту, в нашем случае это время с 8-00 до 18-00 с промежутками в два часа. После заполнения копируем соответствующие строчки кода в шаблон формы и шаблон письма.

В итоге у вас должно получиться вот так:

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

После того как пользователь сделает заказ обратного звонка с вашего сайта, на вашу почту придет письмо с таким наполнением:

ГОТОВО! Вот мы с создали с вами форму заказа обратного звонка с нуля .

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

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

Надеюсь этот урок был вам полезен, и вы разобрались с плагином Contact Form 7.

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

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

Здравствуйте, друзья! В этом уроке мы поговорим о создании формы обратной связи, или как еще говорят в народе "контактной формы". Сегодня мы разберем с вами как можно создать за несколько минут легкую, красивую и функциональную форму обратной связи с помощью моего любимого плагина Contact Form 7. Я постараюсь максимально подробно объяснить все этапы установки контактной формы, и в связи с этим урок получится достаточно длинным:) Создание контактной формы в WordPress В самом начале хочу заметить, что плагин Contact Form 7 русифицирован, и никаких проблем с ним у вас не будет. Как доказательство моих слов может выступать тот факт, что данный плагин…

Обзор

Проголосуйте за урок

100

Оценка

Итог: Уважаемые читатели! Не поленитесь проголосовать и оставить комментарий. Таким образом я смогу понять полезность уроков и статей, и улучшить их качество в будущем. Заранее спасибо!