Блог о программировании, электронике и рыбалке

Форма онлайн регистрации для сайта

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

Иногда возникает необходимость в проведении онлайн регистрации участников на какое-либо мероприятие. Как вариант, можно просто попросить пользователей скачать файл с анкетой, заполнить его и отправить на указанный E-mail. Мне этот способ не нравится, так как он требует дополнительной обработки присланных анкет.

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

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

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

Итак, начнём!

Переходим в Google Документы (Диск) и авторизируемся в нем.

image

В левом углу жмем на кнопку создать и выбираем пункт Форма.

image В новом окне появится редактор форм.

image

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

image

Жмем на кнопку “Готово”.

Переходим ко второму вопросу. Для этого выделяем его кликом мыши и жмем на иконку редактирования.imageВ качестве примера заполним этот вопрос так: Вопрос - Чем вы увлекаетесь?, Пояснение - Опишите ваши интересы и области, в которых вы себя считаете специалистами, Тип вопроса меняем на  - Текст (абзац). Ставим галочку на “Сделать этот вопрос обязательным”.

image

Жмем на кнопку “Готово”.

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

image

Заполним этот вопрос так: Вопрос – Ваш пол, Пояснения – оставим пустым, Тип вопроса оставляем  - Один из списка, Галочку на “Перейти на страницу ответа” – не ставим. Она вам понадобится, если вы решите создавать многостраничные формы. Опять ставим галочку  на “Сделать этот вопрос обязательным”.

image

Жмем на кнопку “Готово”.

Добавляем новый элемент – “Несколько из списка”. Переписывать свои варианты не буду – просто посмотрите на картинку.

imageЖмем “Готово”.

Добавляем новый элемент – “Выпадающий список”. Заполняем как на картинке.

image Жмем “Готово”. Добавляем новый элемент – “Шкала”. Как и раньше – заполните по примеру на картинке.

image

Жмем “Готово”. Смотреться будет так:

image

Добавляем новый элемент – ”Сетка”. Заполняем…

image

Смотрим..

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

image

image

Полученный код добавляем в свою страничку и любуемся результатом.

Загрузка...

Поздравляю. Вы сделали форму онлайн опроса. Создайте новую форму уже со своими параметрами и пользуйтесь на здоровье.

Не будем расслабляться и продолжим рассматривать возможности Документов Google для создания форм.

Давайте закончим рассмотрение редактора форм, а затем перейдем к работе с документами.

В меню “Добавить элемент” у нас осталось два неописанных пункта – это “Заголовок раздела” и “Разрыв страницы”. Я их обычно использую вместе. Иногда форма получается слишком вытянутой и целесообразно разбить ее на две части.  Для этих целей и служит “Разрыв страницы”. А вот “Заголовок раздела” я добавляю после разрыва, чтобы пользователь не забывал, что он заполняет и для чего.

Еще у нас есть меню “Тема”, в котором вы можете выбрать один из предложенных вариантов оформления вашей формы. Есть один нюанс – не все темы корректно отображают русские символы.

image

Теперь вернемся к меню “Дополнительные действия”, в котором мы не рассмотрели пункт “Изменить подтверждение”.imageЗдесь вы можете написать свой текст, который пользователь увидит после заполнения формы. Галочка “Опубликовать сводку ответов” покажет ссылку на результаты вашего опроса пользователям. Не рекомендую ее ставить в формах регистрации на онлайн мероприятия, так как личные данные пользователя лучше не светить в Интернете.

Следующее меню “Просмотреть ответы”. Оно содержит всего два пункта: “Сводка” и “Таблица”.

image

image

Следующее меню “Отправить по электронной почте” позволяет отправить вашу форму на почту пользователя.

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

image

Кликните мышкой по документу. Он откроется в новом окне.

imageКак вы видите, результаты сохраняются в удобном табличном виде.

Не будем рассматривать все пункты меню в этом разделе, а просто разберемся с основными функциями, которые вам понадобятся.

Чтобы сохранить документ, вам необходимо будет в меню “Файл” выбрать пункт “Загрузить как” и выбрать формат документа, с которым вам удобнее работать. Я обычно сохраняю в Microsoft Excel 97-2003.

image Для редактирования формы регистрации вам необходимо будет в меню “Формы” выбрать пункт “Изменить форму”.

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

imageНа этом пожалуй все. Благодарю всех за внимание. Если возникнут вопросы, то задавайте их в комментариях – постараюсь помочь.

Присоединяйтесь к нашей группе в Telegram @GeekElectronics
  • keyboard_arrow_downФорма онлайн регистрации для сайта
    • Автор:
    • Миниатюра: Форма онлайн регистрации для сайта
    • Рубрика: Полезные сервисы
    • Обновлено: 24.10.2018
    • Комментариев: 10
    • Просмотров: 11 959
  • Оцените пожалуйста статью
    1 Star2 Stars3 Stars4 Stars5 Stars
    Загрузка...
  • Поделитесь с друзьями
Geek Electronics

Комментариев: 10

  • Avatar for source
    Игорь:

    Как сделать чтобы после регистрации пользователь подтверждал свой E-mal?

    • Avatar for source
      source™:

      наверное никак
      я даже не нашел как отправить пользователюписьмо после заполнения опроса

  • Avatar for source
    source:

    гугл ввел использование скриптов - уже можно сделать подтверждение на e-mail

    • Avatar for source
      Софья:

      Очень полезная статья, особенно для чайников. Спасибо!! А правда, можно ли отправить пользователю письмо после завершения регистрации??

    • Avatar for source
      виталий:

      я так понял в автор?? подскажите как закрепить форму на сайте....

  • Avatar for source
    виталий:

    статья отличная по сути...но еще вопрос - как ее установить на свой сайт???

  • Avatar for source
    виталий:

    возможно кто то подскажет как закрепить форму на сайте....буду рад

    • Avatar for source
      source:

      "Если вы все закончили, то жмем в правом верхнем углу на кнопку сохранить и чуть левее в меню Дополнительные действия выбираем “Встроить”."
      Появится строка с HTML кодом, который и добавляете себе на страницу

  • Avatar for source
    виталий:

    спасибо!! все четко работает..
    а можно ли залить форму с выплатами реферальных ???

  • Avatar for source
    Инесса:

    Здравствуйте! Спасибо, очень полезно! Если Вас не затруднит- то вопрос. Участнику семинара предлагается выбрать 1 занятие из 5 возможных (5 лекторов), в каждом из 5- возможно только определенное количество человек зарегистрироваться. Как сделать, чтобы участник видел- сколько еще мест осталось в каждой из 5 групп? Спасибо! (если ответите)

Добавить комментарий

arrow_upward