|

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

4 комментария
Этот вопрос возникает у тех, кто лишен возможности использовать какие-либо серверные скрипты на своем сайте. Такое частенько случается на бесплатных российских хостингах (например, Narod.ru).
Вариантов несколько.
Можно сделать еще один сайт на хостинге, который поддерживает серверные скрипты и один из способов отправки почты, а контактную форму разместить на обоих сайтах. В этом случае возникнет проблема обратной переадресации юзеров, которые пришли с HTML-сайта (проблема вполне разрешимая — их можно отлавливать по $_SERVER['HTTP_REFERER'] и отправлять обратно на страницу с соответствующим сообщением.
Но если нет желания или знаний, чтобы возиться со скриптами отправки и с еще одним сайтом, то есть и иной способ — воспользоваться одним из бесплатных сервисов.

1. Google Docs — Документы Google.


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

Под логотипом Google в левом верхнем углу кнопочка-селект «Создать» — выбираем «Форма».


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

Щелкните на него для редактирования. Нажмите кнопку «Инструменты» и в списке выберите «Правила уведомлений...». В открывшемся окошке поставьте галочки «Внесены изменения» и «Сообщение эл. почты — мгновенное» и нажмите «Сохранить».
Google docs - таблица с сообщениями с сайта
Теперь нажмите кнопку «Форма» и выберите «Встроить форму в веб-страницу». Скопируйте код в открывшемся окошке и вставьте в нужное место в коде своей HTML-страницы.

Возможно вам потребуется изменить размеры фрейма (width и height в коде, который вы скопировали для вставки), чтобы форма была без полос прокрутки и аккуратно «вписалась» в ваш лэйаут.

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

Вот пример подобной формы — вы можете отправить из нее тестовое сообщение и посмотреть на него и на все остальные сообщения на этой странице.

Если вас не устроил ни один из предложенных Google дизайнов для формы, вы можете воспользоваться довольно функциональным инструментом для создания форм — JotForm. Сохранить форму можно в формате Google Spreadsheets — тех самых таблиц Google. Hа сайте есть примеры, F.A.Q. и форум.

2. Другие сервисы для создания и размещения форм обратной связи.

Все перечисленные ниже сервисы имеют и платные, и бесплатный тарифные планы.

1. Visitor Contact


Довольно скромный по возможностям дизайна и кастомизации сервис, а точнее, форму вообще никак нельзя изменить. Показывает рекламу Google внизу формы. Поля формы никак не редактируются и остаются на английскрм языке. Зато сообщение приходит к вам сразу на почту.
Из плюсов — отстутствие ограничений на ежемесячное количество отправленных с вашего сайта сообщений и количество форм для бесплатного аккаунта (у остальных перечисленных сервисов они есть) и наличие капчи при отправке — спам вам не грозит. Еще один плюс — в письме кроме самого сообщения указывается также IP-адрес и город(регион) отправителя.
Форма доступна для размещения в виде фрейма или достаточно симпатично оформленного всплывающего javascript-окна.
Пример формы можете посмотреть здесь.

2. Wufoo


Позволяет бесплатно разместить до 3-х форм. Ограничение на количество отправленных вам сообщений — до 100 в месяц.

3. Icebrrg


Аналогично Wufoo.

4. FormSpring


Аналогично Wufoo, но сохраненных сообщений 50 на 1 форму в месяц.

5. FormSite


Бесплатно до 5 форм. До 100 соббщений на форму в месяц.



Раздел: Вёрстка, Дизайн. Тэги: <, , />

Следить за комментариями к этой статье (RSS 2.0) | Оставить комментарий

4 комментария

  1. Ольга 7 Октябрь 2010 в 22:57

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

    и еще вопрос если нехотите заморачиваться с первым: на google есть ограничения?

  2. A1ex 9 Октябрь 2010 в 4:24

    >> Ольга

    Начну со второго — на Google нет ограничений, кроме стандартных ограничений для объема документа, но в данном случае эти ограничения несущественны.

    JotForm — это скорее конструктор форм. Но ограничений там вроде как нет. Разве что полный функционал — с сохранением и просмотром сообщений, платный.

    Если есть трудности с английским, то за время, которое прошло с момента написания этой статьи, появилось достаточное количество подобных русскоязычных сервисов — main-ip.ru, например.

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

  3. Евгений 20 Ноябрь 2010 в 23:30

    Спасибо огромное за пост, очень помог!!!

  4. Люба 7 Март 2011 в 16:23

    Спасибо,все получилось! Никогда не думала что смогу вообще сделать что-то подобное!

Оставить комментарий:

Вы можете использовать следующие тэги: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Где взять аватар?

Вход | Регистрация

Первые комментарии незарегистрированных посетителей проходят модерацию.
Адрес сайта публикуется только после регистрации или проверки (для комментаторов).

− 5 = четыре

|