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

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

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

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

Для чего необходима форма обратной связи

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

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

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

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

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

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

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

Любая форма для обратной связи состоит из двух частей:

  1. Кода, размещаемого на странице сайта. Именно он отображает пользователю поля для ввода данных и отвечает за их визуальное оформление.
  2. Файла php, размещаемого в любой директории на сервере. Он используется для сбора данных из формы на странице и их отправки на указанный адрес.

Инструменты, необходимые для создания формы:

  1. При наличии необходимых знаний можно обойтись только обычным текстовым редактором, таким как Notepad, или воспользоваться более продвинутым аналогом — Notepad++. С его помощью можно довольно быстро откорректировать «под себя» код формы для размещения на html странице и обработчик в PHP файле, используемый для отправки писем. Данный вариант подходит как для статических сайтов, разработанных с использованием html и JavaScript, так и для ресурсов, созданных в онлайн-конструкторах.
  2. Визуальный html редактор для разработки формы. Он может быть установлен в виде отдельной программы на компьютер, к примеру, KompoZer. ПО имеет достаточно простой и понятный интерфейс. С его помощью можно максимально быстро создать форму, просто разместив компоненты на рабочем поле. Редактирование схоже с работой в текстовом редакторе MS Word.
  3. Сделать форму обратной связи можно с помощью визуальных онлайн редакторов. Они позволят не только создать оформление для нее, но и автоматически генерируют php-файл для размещения на сервере.
  4. В случае, если сайт работает на CMS, такой как WordPress или Joomla, можно обойтись установкой специального плагина, добавляющего на страницу форму обратной связи.
  5. Кроме того, для размещения файлов и корректировки страницы с формой потребуется доступ к хостингу, на котором размещен сайт. Для этого можно воспользоваться FTP-клиентом FileZilla.

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

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

Как сделать форму обратной связи с помощью онлайн-конструктора A5

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

Рассмотрим создание формы обратной связи по этапам

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

Добавление виджета обратной связи

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

Изменение размеров и перемещение формы

Чтобы попасть в настройки виджета, следует нажать на нем правой кнопкой мыши и выбрать пункт контекстного меню «Конструктор форм».

Контекстное меню, конструктор форм

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

Конструктор форм

Краткое описание компонентов и их функций, которое поможет разобраться, как настроить форму обратной связи на сайте:

  1. В поле «Адрес почты для сообщения» необходимо ввести ту электронную почту, на которую Вы хотите получать заявки с сайта.
  2. Поле «Текст сообщения успешной отправки» позволяет задать текст, который отобразится пользователю, когда его заявка будет отправлена.
  3. В левой колонке перечислены компоненты, которые могут быть добавлены на форму.
    1. Заголовок может использоваться для размещения подписи к форме и описания ее предназначения.
    2. Текстовое поле предназначено для дополнения сообщения коротким текстом от пользователя.
    3. Большое текстовое поле позволяет отправлять сразу несколько строк текста.
    4. Компонент «Множественный выбор» дает возможность пользователю установить «галочки» напротив нескольких необходимых пунктов, к примеру, при выборе дополнительных опций, таких как доставка товара и подарочная упаковка.
    5. «Одинарный выбор» довольно похож на предыдущий компонент, но позволяет выбрать только один из предложенных вариантов.
    6. Выпадающий список позволяет выбрать пользователю одно из предустановленных заранее текстовых полей.
    7. Поле Email предназначено для ввода электронной почты пользователя.
    8. Компонент «Файл» позволяет прикрепить к сообщению файл с компьютера пользователя.
    9. Компонент «Дата» позволяет добавить к сообщению поле с форматированной датой.
  4. В правой колонке отображаются поля, установленные в Вашу форму.
    1. Текстовое поле для ввода сообщения от пользователя.
    2. Поле Email для ввода электронной почты.
    3. Кнопка «Отправить» для передачи сообщения. Для того чтобы настроить ее внешний вид, следует один раз кликнуть по ней мышью.

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

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