Виджет обратной связи wordpress. Готовые решения для вашего проекта

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

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

Представляю вашему вниманию ТОП 5 WordPress плагинов для создания обратной связи.

1. WPForms

WPForms — это молодой WordPress плагин по созданию форм обратной связи.

Плюсы

Используется визуальный редактор Drag&Drop, который делает этот плагин еще более «user-friendly» (удобный для использования).

Лайт версия не ограничивает установку плагина на безграничное кол-во доменов.

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

Минусы

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

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

Gravity Forms — это премиум плагин, который предоставляет огромное кол-во функционала (какое вы только можете пожелать).

Плюсы

Мощный плагин, с неограниченным количеством функционала.

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

Минусы

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

Ninja forms — это идеальное решение для создания бесплатных форм в WordPress. Может так же использоваться для формирования высоко интерактивных форм.

Плюсы

Плагин доступен бесплатно с официального сайта WordPress. Установку можно на неограниченное кол-во сайтов.

К дополнению к бесплатной версии есть премиальная, которая имеет еще больше функций (такие как: SMS уведомления, Freshbooks, Campaign Monitor и Salesforce).

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

Минусы

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

Pirate — это бесплатный WordPress плагин написанный командой Themeisle. Легко настраивается и удобный для создания простых форм.

Плюсы

Абсолютно бесплатный для скачивания и последующих обновлений.

У этой плагине есть все многие функции, например такие как: CAPTCHA для проверка от ботов и SMTP, чтобы убрать вероятность попадания письма в папку «Спам».

Минусы

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

Недостаток дополнений (других плагинов), которые совместно работают.

Факт! У этого плагина больше всего загрузок из всех плагинов связанных с построением форм.

Плюсы

Основной плюс — это бесплатность и возможность установить на неограниченное количество сайтов.

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

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

Минусы

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

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

Всплывающие формы

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

Официальная документация сайта WordPress, пишет, что «Shortcode» — это набор функций для создания специальных элементов на странице используемых в содержимом записей или страниц.

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

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

Вывод

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

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

Качество всегда продавалось, поэтому ожидать от бесплатных плагинов обширного функционал я бы не стал. Пользуйтесь тем, что пока можете себе позволить. Как только у вас появится возможность — обновляйте плагин до «Pro» версии или купите другой плагин (возможно какой-то понравился больше).

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

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

форма обратной связи WordPress, методы создания.

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

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

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

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

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

Как сделать форму обратной связи в WordPress?

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

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

Зайти в его интерфейс можно с . После того как вы зайдете в данное меню, вам откроется такое диалоговое окно:

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

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

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

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

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

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

Надеюсь наши вам полезны, оставайтесь с нами и вы узнаете еще очень многое.

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

Но еще затронем немного теории, если кому-то не интересно, то сразу можно перейти к установке формы на WordPress:

Теория: Зачем нужна форма обратной связи?

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

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

Минусы email-адреса в контактах:

Приходит много спама от ботов;

Редко пишут посетители;

Нет пользы от страницы.

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

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

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

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

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

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

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

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

2. — всплывающая форма обратной связи

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

3. Contact Form 7 — худший из лучших

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

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

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

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

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

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

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

А вот уже за 5$ можно получать 1000 писем, встроена система антиспама, добавлено дисковое пространство, формирование отчетов и с легкость можно подключить сервис рассылок.

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

Видеоуроков не нашел, а вот хорошая инструкцию по установке — есть!

Php форма обратной связи без плагинов

Что потребуется для создания собственной формы обратной связи? Всего лишь выполнить 4 простых действия:

Создать php файл;

На странице контактов (в формате html) написать несколько строк;

Подключить гугл библиотеку (если форма не работает);

Если она не красивая — добавить стили.

Мне не хотелось подробно описывать все на сайте, поэтому я снял видео и сделал архив с нужными файлами на Яндекс диске. Архив файлов можно скачать — .

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

У кого-то не работает форма? Тогда вам необходимо в файл header.php вставить: (подключение гугл библиотеки). Надеюсь, что инструкция предельно понятная и простая для каждого. Так же в архиве вы найдете файл со стилями. Просто копируете все строчки и вставляете в файл style.css в конце.

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

Вместо выводов

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

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

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

Для создания формы обратной связи на 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 может быть создана благодаря известному и популярному плагинe – Contact Form 7. Такую известность он обрёл за то, что обладает поразительной гибкостью и многофункциональностью. А кроме того, он по большей части переведён на русский язык и бесплатный.

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

Форма обратной связи в WordPress и другие элементы взаимодействия с аудиторией

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

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

Рассмотрим Contact Form 7 подробнее. Скачайте его по ссылке ниже, установите на свой сайт и активируйте.

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

Шорткод формы, созданной по умолчанию

Также можно создать собственную форму обратной связи в WordPress. Для этого нужно в пункте «Contact Form 7» перейти в подпункт «Добавить новую». Для начала можно дать форме название. Здесь также имеется конструктор форм с несколькими вкладками.

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

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

Рассмотрим сначала вкладку «Шаблон формы». Она представляет собой редактор с кнопками сверху. Каждая кнопка добавляет то или иное поле в форму.

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

Вот какие поля есть:

text – однострочное текстовое поле;
email – электронная почта;
URL – адрес в интернете;
tel – телефон;
number – поле для ввода цифр;
date – поле для написания даты с выпадающим календарём;
text area – текстовое многострочное поле;
drop- down menu — список;
checkboxes – чекбоксы, то есть галочки;
acceptance – тоже чекбокс, только больше подходит для установки опции согласия с определёнными условиями;
quiz – задаёт простой вопрос (например, 1+1=?), можно использовать в качестве капчи.
reCAPTCHA – устанавливает капчу Google рекапча (где нужно просто поставить галочку в поле «Я не робот»), но для работы требуется сначала получить ключи;
file – кнопка «Обзор», чтобы вложить файл;
submit – кнопка отправить.

Чтобы установить тот или иной элемент в форму, нужно поставить курсор мышки в нужном месте, и кликнуть на соответствующую кнопку.

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

Давайте рассмотрим пример. Допустим, нужно установить в форму текстовое поле. Ставим курсор мышки в нужном месте формы и нажимаем кнопку text. Открывается окно настройки поля.

Окно настройки поля

Здесь есть следующие опции:

Field type – если нужно, чтобы это поле было обязательным, то поставьте здесь галочку.
Имя – имя поля. Можно поставить по умолчанию.
Значение по умолчанию – здесь можно записать, что будет в поле, если пользователь ничего не ввёл, то есть, что будет написано по умолчанию. Заполнять не обязательно.
Akismet – можно подключить к полю .
Id attribute – дополнительный атрибут поля, можно не заполнять.
Class attribute – атрибут стиля поля, тоже не обязательное поле.

Когда всё, что нужно заполнено и настроено, нажмите кнопку «Insert tag», чтобы установить поле в форму. Это базовые опции, у других полей есть дополнительные, индивидуальные опции.

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

Добавленный тег

Теперь нужно дать ему пояснения, присвоить надпись. Форма обратной связи в WordPress, созданная плагином Contact Form 7, поддерживает в своём редакторе HTML. Поэтому можно использовать теги для выделения текста, создания отступов или переводов на новую строку. Например, созданное нами поле можно оформить так:

Перейдём во вкладку «Письмо». Здесь у нас настраивается шаблон письма. Вот, что мы имеем:

T o. В этом поле указывается, на какую электронную почту будут отправляться письма.
From. Здесь указывается, какой адрес будет фигурировать в качестве адреса отправителя.
Тема. Заполняется тема письма.
Additional Headers. Дополнительные заголовки – можно написать информацию об отправителе, например.
Message Body. Само тело письма.
Исключить вывод строк с пустыми тегами сообщения. Если включить это, то в пришедшем письме не будет полей, которые в форме были не заполнены.
Использовать HTML-формат письма. Все HTML теги будут видны, визуального оформления не будет, если включить эту галочку.
File Attachments. Если в форме обратной связи WordPress предусмотрены вложения файлов, то, чтобы они пришли, здесь нужно указать их теги.

Чтобы в письме, которое придёт после отправки формы, было содержание тех или иных полей, необходимо поместить в шаблоне тот или иной тег. Так, допустим, если мы добавили поле text «text-439» в форму, то, чтобы его содержание пришло в письме, следует в нужном месте написать его.

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

В этой же вкладке есть раздел «Письмо 2» Если поставить галочку на «Use Mail (2)», то можно сделать, чтобы отправлялось ещё одно письмо. Открывается такой же редактор, как и для первого письма.

Включение второго письма

По умолчанию, это письмо будет уходить отправителю формы (в строке «To» установлен тег , то есть отправляться будет на ту почту, которую укажет отправитель в форме). Например, там можно написать уведомление о том, что письмо до вас дошло или что-нибудь ещё. При необходимости можно сделать, чтобы письмо отправлялось какому-то другому, конкретному адресату, например второму администратору.