Красивая своя формы обратной связи вордпресс. Защита формы обратной связи

Форма обратной связи – один из важнейших элементов на сайте или блоге на WordPress

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

Что необходимо для создания обратной связи на WordPress?

Обратная связь может быть создана различными способами. Лучшее решение – с помощью плагина. Самыми востребованными являются:

• Contact Form 7;
• Usernoise;
• SimpleModal Contact Form;
• Custom Contact Forms;
• Slick Contact Forms.

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

Contact Form 7 – быстрая контактная связь и простота настроек

Плагин CF 7 дает возможность легко и просто создавать и настраивать обратную связь. Он очень легкий, совершенно не грузит сайт, а также считается самым простым в настройке. Многие выбирают именно его, . Contact Form полностью русифицирован, что весьма удобно, и имеет интуитивно понятные настройки, разобраться с которыми очень легко. При этом, он полностью бесплатный и гибкий. Есть как простая установка – для всех, кому нравится простота, так и много глубины и сложности – для всех, кто любит углубиться. Поддерживает самые различные формы в окне, отправку через AJAX, интеграцию с Akismet, загрузку файлов, а также оснащен защитой от спама с помощью капчи и текстового вопроса. Многие признали его одним из лучших плагинов для системы управления контентом. CF 7 позволяет самые разнообразные сложные формы. В списке сразу же отображаются шорткоды, необходимые для вставки на страницу.

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

Usernoise имеет весьма широкий функционал, позволяя сделать красивую и простую в понимании всплывающую форму в окне. Но есть некоторый минус – полная часть его возможностей представлена в платной версии. Однако многим достаточно функций, которые представлены в бесплатном варианте. По умолчанию Usernoise для WordPress уже настроен как нужно, все что нужно – просто его включить. Дальнейшие настройки, по желанию владельца сайта, осуществляются тоже незатруднительно. Можно изменять расположение кнопки, изменить ее цвет и фон текста, добавить иконку к кнопке, поменять шрифт и поменять стандартные надписи. Все это легко настраивается из админки. С его помощью кнопка станет уникальной. Плагин полностью русифицирован, что максимально облегчает работу с ним. Идеально подходит для блогов. Usernoise поддерживается практически всеми знаменитыми браузерами – Opera, Firefox, Safari, IE7 (от 7 версии). Главным преимуществом данного плагина является его высокая производительность, он не оказывает влияния на скорость загрузки.

SimpleModal Contact Form – быстрая всплывающая форма в модальном окне

SimpleModal Contact Form (SMCF) представляет собой обратную связь, которая интегрирована в модальное всплывающее окно. Работает на WordPress при помощи jQuery. Плагин русскоязычный, благодаря Николаю Мясникову и другим «народным умельцам», принимающим участие в его русификации. Перевод на русский язык выполнен максимально грамотно, учитываются все малейшие детали. Всплывающее окно, которое выводит SMCF внешне напоминает окно плагина Lightbox. Это очень удобная вещь для всех, кто хочет дать возможность пользователям написать письмо, просто во всплывающем окне где угодно – в конце поста, на отдельной странице либо в Сайдбаре. Все работает очень быстро и удобно. Установка осуществляется самым традиционным способом. Также обратная форма проверяет правильность заполнения полей ввода. В опциях есть возможность сделать автоматическую подстановку заголовка страницы в теме письма, что является довольно весомым достоинством, когда он используется для заказа к описанию товаров. Тема письма позволит сразу увидеть какой товар заказан.

Custom Contact Forms – обратные формы любой сложности

Плагин Custom Contact Forms (CCF) очень популярен на сегодня. С его помощью можно сделать формы любой сложности на WordPress. Но, стоит отметить, что CCF не имеет русской локализации. Хотя это не играет особой роли, поскольку разобраться в нем проще простого, даже тем, кто не знает английский язык. Созданные формы вставляются в любые страницы, материалы и отдельные записи. Для создания простой формы не нужно копаться в настройках, все, что потребуется – вписать код в любую статью, а дальше уже все делается автоматически. Есть также специальный виджет, который можно вставить в боковую панель, либо же в любые иные места на сайте, отведенные под виджеты. Никаких особых знаний CSS для настройки при этом не требуется, а настраивается практически любой аспект: цвета, размеры, границы, отступы. Управление стилями осуществляется прямо в , там же, где настраиваются все поля ввода значений. Работает на современных технологиях Ajax и jQuery.

Slick Contact Forms – простое добавление нескольких обратных связей

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

Все плагины, перечисленные выше, заслуживают внимания и имеют свои достоинства. Однако выбор будет зависеть от личных предпочтений. Например, если необходимо встроить обратную связь в страницу, то лучше выбирать первые плагины, в частности Contact Form 7. Если же всплывающие окна больше нравятся – лучше остановить выбор на SMCF и Usernoise.

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

В этой статье вы узнаете:

Плагин обратной связи для WordPress

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

После скачивания распакуйте архив и скопируйте файлы на сервер в папку /wp-content/plugins/ . После активации плагина переходите к его настройкам в панели администратора. Справа в меню появится пункт «Contact». Значит, плагин обратной связи WordPress установлен и запущен. Для установки стандартной формы CF7 на сайт достаточно скопировать код «форма для контакта», который вы увидите в меню Contact. Если вы хотите настроить форму по своему усмотрению, перейдите по ссылке «Добавить новую».

В результате появится несколько полей:

Название формы;

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

Почтовые настройки;

Дополнительная форма обратной связи;

Сервисные сообщения;

Дополнительные настройки.

Пункты 2 и 4 позволяют воспользоваться конструктором для разных видов форм. Например, так вы можете создать всплывающую форму обратной связи WordPress. После заполнения всех полей, можно получить готовый код для страницы контактов. Настройка доп. формы (№4) помогает получать не только письма на почту, но и, например, смс-сообщения на указанный телефон.

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

Как вариант, можете еще испробовать плагин Cforms , он более сложен, но и функций у него больше.

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

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

Для начала нужно создать отдельный файл *.php (например, contact.php или mail.php). После создания лучше поместить его в папку с темой шаблона, тогда можно будет его редактировать из админки.

Вот код, который нужно вставить в созданный вами файл php:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20

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

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

Для этого можно использовать такой код:

1 2 3 4

Форма обратной связи Ф.И.О. E-mail ТемаТекст сообщения:

Форма обратной связи Ф.И.О. E-mail ТемаТекст сообщения:

Здесь самое важное указать правильный путь к тому файлу php, который вы создали (в нашем случае, это contact.php). В данном коде по своему желанию и вкусу можете менять названия полей, и их ширину.

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

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

Большой популярностью на моем блоге пользуются статьи, в которых я рассказываю, как сделать оформление элементов блога с помощью css-кода:

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

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24

.wpcf7-form input[ type= "submit" ] { background : #63c6ae ; /* цвет фона кнопки Отправить*/ border : 0 ; width : 120px ; /* ширина кнопки Отправить*/ color : #fff ; /* цвет текста кнопки Отправить*/ height : 30px ; /* высота кнопки Отправить*/ } .wpcf7-form textarea { display : block ; margin-top : 5px ; /* верхний отступ от поля Текст сообщения*/ background : #fff ; border : 1px solid #63c6ae ; /* граница поля Текст сообщения*/ width : 400px ; color : #222 ; padding : 10px 10px ; } .wpcf7-form input[ type= "email" ] , .wpcf7-form input[ type= "text" ] { background : #fff ; border : 1px solid #63c6ae ; /* граница текстовых полей*/ width : 400px ; color : #222 ; height : 30px ; /* высота текстовых полей*/ padding : 0 10px ; /* внутренние границы текстовых полей*/ }

Wpcf7-form input { background: #63c6ae; /* цвет фона кнопки Отправить*/ border: 0; width: 120px; /* ширина кнопки Отправить*/ color: #fff; /* цвет текста кнопки Отправить*/ height:30px; /* высота кнопки Отправить*/ } .wpcf7-form textarea { display: block; margin-top: 5px; /* верхний отступ от поля Текст сообщения*/ background: #fff; border: 1px solid #63c6ae; /* граница поля Текст сообщения*/ width: 400px; color: #222; padding: 10px 10px; } .wpcf7-form input, .wpcf7-form input { background:#fff ; border: 1px solid #63c6ae; /* граница текстовых полей*/ width: 400px; color: #222; height:30px; /* высота текстовых полей*/ padding: 0 10px; /* внутренние границы текстовых полей*/ }

В результате у меня получилось вот так:

Рассмотрим вариант с использованием плагина Contact Form 7. После того, как плагин установлен и настроен, вам потребуется открыть файл style.css вашей активной темы и вставить в конце следующий код:

Как видите, в создании обратной связи на WordPress как с плагином, так и без него, нет ничего сложного.

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

1.

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. Как можно заметить, существует очень много подходов и каждый хорош по своему.

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

Тем, кто хоть как-то желает иметь связь с посетителями часто задаются вопросом: как сделать форму обратной связи на сайте? которая выводится обычно на странице контактов, чтобы посетители имели возможность написать вам по какому-либо поводу. Такую форму обратной связи не нужно делать самому, её уже придумали и вам достаточно лишь установить плагин обратной связи, который поможет без труда установить нужную форму и настроить под ваши нужды. в этом обзоре вы ознакомитесь со списком лучших плагинов форм обратной связи, которые имеют различные возможности и направления и с их помощью них можно организовать любые формы на своем сайте без привлечения программиста, а это будет гораздо дешевле, иначе говоря тот же результат за меньшие деньги. Найти их можно будет в репозитории ru.wordpress.org/plugins/ поиском, вписав соответствующее наименование плагина форм в строку поиска.

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

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

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

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

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

Список плагинов обратной связи в Вордпресс1. Сontact Form 7

Будет правильным, если мы начнем с самого популярного плагина формы обратной связи в WordPress Сontact Form 7(БЕСПЛАТНЫЙ) — которым воспользовались уже более 5 миллионов человек. Он достиг такой популярности за счет длительного периода использования, на протяжении которого он постоянно менялся только в лучшую сторону, поэтому он признан лучшим плагином обратной связи. Он очень простой в использовании и с минимальными настройками, с которыми справляются даже дилетанты, но навыки работы с html должны быть, потому, что форму нужно будет подредактировать и сменить надписи на русский язык.

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

2. Contact Form by BestWebSoft

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

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

3. Contact Form Builder WordPress Plugin by vCita

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

4. Jetpack

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

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

5. Ninja Forms

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

6. Visual Form Builder

— это плагин формы обратной связи в wordpress, который может вас порадовать в случае его выбора. Ведь он имеет ряд полезняшек: антиспам система, сохранение в базе данных записей, вставка формы с помощью шорткода, экспорт записей в CSV и другие прелести. Он очень удобный, так как поля добавляются обычным перетаскиванием, но больше он полезен тем, что можно создать любые поля, ведь он нацелен не только на обратную связь, а на установку различных веб-форм. Мне он не понравился тем, что когда вставляешь форму в виджет, то первые буквы надписей полей закрыты каким-то значком, исправить самому не удалось. А в других местах было всё хорошо.

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

7. Contact Form by Supsystic

— это плагин обратной связи с recaptcha, простой и удобный тем, что он предназначен только для обратной связи, причем настройка занимает считанные секунды и нет ничего лишнего. Более того очень хорошо встраивается в вашу тему. По функционалу он похож на Сontact Form 7, т.е. те же возможности, ну а чем он понравится вам, можете сказать после его опробования.

8. Formidable Forms - Form Builder for WordPress

— он поможет вам добавить форму обратной связи на сайт, так и форму опросов, формы покупок и формы заказов, форм регистрации пользователей, календарей событий, а также любые другие формы, которые будут хорошо смотреться на экране любого размера, будь то планшет или смартфон. Более того можно добавлять свои поля, а можно использовать уже готовые формы, которые предлагает использовать разработчики данного плагина. Можно настроить стиль вашей веб-формы, правда если вы будете выводить эту форму, то она будет везде одинаковая, а вот если вы захотите, чтобы она различалась, то вам необходимо переходить на платную версию PRO. А вот платная версия уже может реализовать многостраничную форму, применить условную логику, сделать интеграцию платформ, можно управлять данными и др. Платная часть позволяет делать ввод, отображение, редактирование и фильтрацию данных в интерфейсе вашего сайта без каких-либо дополнительных плагинов. Честно сказать, от возможностей данного плагина голова пухнет, конечно опробовать все возможности просто не хватит времени. Часто подобные плагины используют в магазинах и на сайтах сбора информации, опросниках и прочих.

9. FormCraft – Form Builder for WordPress

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

10. FormGet Contact Form

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

11. Very Simple Contact Form

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

12. Quick Contact Form

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

13. RegistrationMagic-Custom Registration Forms

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

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

14. Контактная форма от WPForms

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

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

15. Caldera Forms

— имеет визуальный редактор и упрощает создание формы для WordPress. Можно настроить свою форму с помощью нескольких столбцов, добавить дополнительные страницы и собрать ответы пользователей, чтобы анализировать соответствующую информацию от ваших клиентов и посетителей сайта. Анти-спам, AJAX, уведомления по электронной почте и отслеживание записей в базе данных включены по умолчанию. Мне он понравился своей условной логикой для полей форм, в то время как остальные предлагают это в платных версиях, но у этого плагина тоже есть платное расширение. Ещё мне понравился очень большой список часто задаваемых вопросов FAQ, где описываются различные варианты, которыми можете воспользоваться вы, если почитаете.

16. Smart Forms

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

ПЛАТНЫЕ ВЕРСИИ плагинов форм обратной связи

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

17. Ninja Kick: WordPress Contact Form

— стоит $19. Он поставляется с 3 потрясающими темами, социальным баром, интеграцией Mailchimp и обширной настройкой дизайна. Этот легкий плагин использует современные переходы CSS3, имеет макет, реагирующий на изменения размера экрана, хорошо работает на мобильных устройствах и реагирует на жесты. Форма отправляется через AJAX, поэтому не перезагружает вашу страницу. Красота этого плагина заключается в скрытой форме или плавающей кнопке, при нажатии на которую форма обратной связи мгновенно вылетает и уже готова к работе, более того красивая анимация делает это изящно. Наверно ради этого люди соглашаются платить, ну а стоит он этого или нет, решать вам.

18. Gravity Forms (gravityforms.com)

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

19. Quform

— стоит $29. Этот платник сдается по возможностям перед Грейвити, но зато и стоит он в половину дешевле. Так что всё зависит от поставленной задачи. Но в надежности ему можно поставить смелую 5-ку из 5, потому как отзывы у него прекрасные. Я так полагаю техподдержка старается и уважает своих клиентов.

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

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

Оценка

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