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

Сделать всё идеально с нуля сложно и долго, поэтому часто выбирают готовые решения:

бесплатные сервисы, вроде Google Forms и Яндекс.Формы;
платные/условно-бесплатные инструменты;
различные плагины для CMS.

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

Мы предлагаем решение проще — гибкий и многофункциональный бесплатный конструктор QForm, который генерирует обратную связь для сайта любого вида и сложности, синхронизируется с CRM-системами, SMS-сервисами и облачными АТС.

За счёт простоты настроек и понятного интерфейса его освоит любой пользователь без навыков работы с кодом. Формы работают с любыми CMS, в том числе самописными. Встроенная мини-CRM система позволяет отслеживать и обрабатывать заявки в удобном интерфейсе.

Инструкция по работе с QForm

Чтобы продемонстрировать работу сервиса, разберём процесс создания простой формы обратной связи.

Пример: нужен простой вариант с именем, номером, отправкой файла и текстовым сообщением, согласием на обработку персональных данных и кнопкой «Отправить».

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

Первый этап

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

Задаём поля

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

В нашем примере первым будет Имя. После его добавления, откроются настройки. Для имени это: Заголовок, Текст внутри (плейсхолдер), Дополнительный текст, чекбокс Обязательное поле. Также можно назначить список стоп-слов и задать Класс поля и его Имя (атрибут name в коде). Прописывать каждое поле не обязательно — можно всё оставить по умолчанию, сохранив поле на кнопку «Сохранить».

В нашем случает зададим заголовок — «Ваше имя». Ставим галочку «Обязательно для заполнения».

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

Теперь добавляем возможность загрузки файлов: в заголовок впишем «Выберите файл», укажем 50 Мб как максимальный размер файла. Пусть поле будет не обязательным.

Чтобы пользователь мог вписать произвольный комментарий, нужно создать текстовое поле с типом Текст (строка), в заголовке Сообщение.

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

Определяемся с дизайном

На одном экране с Конструктором находится вкладка Дизайн. Здесь у пользователей два варианта — использовать один из шаблонов оформлений QForm (включенный чекбокс) или указать каждому полю стили оформления из CSS-файла, чтобы адаптировать дизайн формы под дизайн сайта.

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

Настраиваем параметры формы

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

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

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

На вкладке Google Recaptcha можно включить антиспам от гугл, при условии что она настроена на уровне сайта.

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

JavaScript-события нужны для настройки отправки целей в Google Analytics и Яндекс.Метрику, выполнение дополнительного кода после отправки.

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

Уведомления

Отдельно стоит упомянуть отправку уведомлений. На этой вкладке можно указать email получателей заявок через запятую. В противном случае, обрабатывать заявки получится только внутри кабинета QForm. Тут же настраивается SMTP.

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

Завершив все нужные настройки, переходим на вкладку Код для вставки и выполняем инструкции по вставке кода на сайт.

Вот что в итоге у нас получилось! Создание обратной связи вряд ли займёт больше 15 минут даже в первый раз. Если у Вас возникнут проблемы, не стесняйтесь обращаться в чат поддержки.

Empty