Доброго времени суток уважаемые посетители. Сегодняшняя статья открывает новый раздел нашего сайта, этот раздел будет связан с категорией "Наши услуги". Как вы уже поняли речь пойдет о создании форм обратной связи, которые в свою очередь могут быть использованы для абсолютно разных целей.
Что такое форма обратной связи?
Данный виджет или плагин еще называется формой контактов, которая служит для удобной установки связи между владельцем сайта и его посетителями. Их комплектация может быть абсолютно разной, что в свою очередь делает каждую из них уникальной и пригодной для той или иной сферы деятельности. Кроме того данные формы так же, как и сайты могут иметь свой дизайн.
Blogger: форма обратной связи не работает
С августа 2019 виджет форма обратной связи перестала работать. Причина неизвестна, команда Blogger уже трудится над устранением данной проблемы. Каких то точных дат восстановления всех функций виджета пока что никто не знает.
Blogger: Как добавить форму обратной связи
На данной странице я подготовил для пользователей Blogger две стильных формы обратной связи, плюс бонусом идет фиксированный вариант формы.
1. Первая форма
Описание:
3 строки, Имя, Email, Текст сообщения, Кнопки отправить и очистить форму, Иконки, Темный фон.
Установка:
1) В разделе Дизайн Добавьте новый гаджет, перейдите на вкладку Другие гаджеты, в списке выберите Форма для связи.
2) Теперь создайте страницу или сообщение, перейдите на вкладку HTML и вставьте следующий код:
3) Опубликуйте страницу \ сообщение.
4) Перейдите в раздел Тема - Изменить HTML найдите в конце тег
и перед ним вставьте код:
5) Сохраните тему и проверьте работу виджета.
2. Вторая форма
Описание
:
Вторая форма более новая и создана в стиле Material Design. Имеет три строки для ввода данных и кнопку Отправить.
Установка:
1) Создайте сообщение или страницу, перейдите на вкладку HTML, здесь вставьте код:
2) Строки выделенные красным цветом смените на ID своего блога, его можно найти в верхней строке браузера, когда находитесь в панели управления блога. Строку выделенную желтым смените на ссылку совего блога.
3) Опубликуйте страницу и проверьте работу виджета.
Дополнительная информация
Такой вопрос, если в форме не указывается моя почта куда приходит сообщение? А приходит оно на ваш имейл, привязанный к вашему аккаунту Гугл. Но это еще не все, чтобы найти его в своей почте gmail нужно вверху перейти из вкладки Несортированные во вкладку Соцсети.
3. Фиксированная форма связи для Blogger
Эта форма по сути ничем не отличается от обычной формы Blogger и выполняет все те же функции. Однако в некоторых случаях, например, когда владельцу сайта нужно показать пользователю, что мол вот смотри друг, я всегда на связи, пиши в любое время суток и я всегда отвечу. Так вот в таком случае лучше, когда форма связи всегда на виду (пользователь очень ленивый и не всегда захочет искать где там та форма находится) и с помощью фиксирования формы на каждой странице мы упростим задачу пользователей. Демо и процесс установки виджета вы можете посмотреть на видео. Скачайте код формы и следуйте указаниям на видео:
Заказать форму Обратной связи под дизайн сайта
Если вы хотите для своего сайта, что-то более яркое, и то что впишется в дизайн вашего сайта, с дополнительными функциями и виджетами, тогда обращайтесь. Чуть ниже я навел несколько пример того, какими могут быть формы.
Типы форм и их функциональность.
Формы обратной связи могут использоваться на любом сайте или блоге. Имеется ввиду не только платформа но и тематика. Теперь перечислим некоторые их типы.
1. Стандартная форма
Обычная или стандартная форма обратной связи включает в себя около трех основных полей:
Ваше Имя
Почта
Тестовое поле
По желанию можно добавить еще несколько полей, чтобы пользователь мог отправить более обширную информацию. Пример такой формы вы можете увидеть на картинке ниже (Форма для заказа или покупки товаров).
2. Форма для заказа или покупки товаров
Этот тип уже может включать не только поля, но и дополнительные функции. Например, можно сделать выпадающий список наименования товаров, к ней добавить функцию количества покупаемого товара, его стоимость и общею стоимость всего заказа. Пример на картинке ниже:
Это только часть функций, которые к ней добавлены. Более подробно я расскажу о данных функциях чуть позже.
3. Форма для онлайн бронирования номеров отеля
Эта форма так же использует более широкие настройки. Ее самым главным элементом является календарь с помощью которого посетитель может указать дату заезда и выезда и указать тип номера, который он хочет забронировать. Пример можете посмотреть на одном из наших демо сайтов.
4. Форма для анкеты - онлайн опросы
Иногда бывает весьма полезно узнать, что думают посетители о вашем сайте, о продукции, которую вы продаете или о сервисе, который предоставляете. В этом вам поможет форма для онлайн опроса. Мини пример такой анкеты на картинке ниже:
Итак, самые ходовые формы контактов мы с вами разобрали. Теперь, как и обещал расскажу о дополнительных функциях.
Функции или виджеты форм обратной связи
Из первой части данного материала вы узнали, что такое форма обратной связи и какие ее типы бывают. Теперь вы узнаете, что к ним можно добавлять дополнительные виджеты, благодаря которым можно сделать форму под любую тематику, не только под первые четыре типа, или же существенно усовершенствовать ее.
Список основных виджетов:
Добавление видео (youtube, vimeo и др.)
Слайдер с картинками
Проверочный список (отмечается галочками)
Загрузка документов с вашего ПК, сервисов Google Drive, Drop Box, Box
Загрузка картинок для работы над дизайнерскими проектами
Цифровая роспись
Таблицы
Списки
Кнопки соцсетей
Кнопка вызова по Скайпу
Календари
Калькуляторы
Карты с местом нахождения
Подтверждение E-mail (пользователь не отправит данные пока не подтвердит свою почту)
Капча от google recaptcha
Комментарии от disqus, facebook
Ваши твиты с Twitter
Часы
Справочник мобильных кодов для каждой страны
Таймер
Таймер обратного отсчета
Анимационные заголовки
Как видите список не малый и это еще не все виджтеы, которые можно встроить в форму обратной связи.
Детали заказа
У нас вы можете заказать форму обратной связи, онлайн бронирования номеров, для покупки товара или же согласно тематике своего сайта. Стоимость будет зависеть от ее типа. Работа над заказом занимает до двух дней.
Стандартная форма - 10$
Остальные типы форм - от 20$
Если у вас возникли вопросы, задавайте их в комментариях, или на странице с контактами .
Комментарии и отзывы пользователей
Сергей Дрозд Очень пригодилось! Спасибо!
igori stoia Спасибо дружище! Просто спас от знания злостного HTML
YouCuber Спасибо вам огромное за урок!Очень полезно.Поставил на сайт всё работает.Удачи!
Роман Зырянов
Отлично, всё работает!
Алина сергеева всем привет, кто пользовался подскажите, плиз. Капча есть?
Eugene Veprytskyi Алина сергеева, капча есть и другие прикольные штуки.
Vladimir Serpov
Отличная информация. За неимением возможности быстро вникнуть в отправку через .js или php искал способ как-нибудь быстро сделать форму на сайт. Работает, спасибо!
Юрий Блинов Вы лучший, спасибо что описали сервис, это намного удобнее, чем писать ее в php
TERMINAL Production
Спасибо, всё работает, вы заслуживаете больше читателей, удачи
KCEHIA Вот бы побольше таких уроков! Искала готовые скрипты, я ж не программист, но с этим уроком сама сделала форму онлайн записи с датой, с checkbox
Micro1001 Dobb Вообще супер! жду продолжения! Спасибо!)
Константин Базик Хороший урок, очень помог! Спасибо!
Oleksii
Спасибо за урок. Все работает отлично.
Александр Все круто. Я использую такую форму. функциональна и проста. можно делать кучу форм из одного скрипта.