Создание формы для продажи пластиковых окон

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

• Возможность утери - вам придется хранить стопку бумаги с заявками и вполне есть вероятность, что, например, Василий Иванович прольет на нее случайно кофе или вовсе забудет, куда положил (потеряет) анкету;
• Ее не могут заполнять одновременно несколько человек - чтобы это осуществить вам придется самому стараться уделить внимание каждому клиенту путем формирования очереди. Это приведет к недовольству клиентов и тратам большого количества времени и сил. Иначе вы можете нанять несколько человек, которые будут этим заниматься. Однако это не исключит наличие очередей, вдобавок непременно понесет за собой расходы на заработную плату сотрудников;
• Трата времени на проверку - вам придется каждый раз смотреть, все ли поля заполнены, в то время как в электронной форме вы можете сделать эти поля обязательными и тогда клиент не сможет отправить форму, если не заметит пропуск.

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

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

• Программирование - длительный и трудоемкий процесс, требующий большого объема знаний в области программирования. Даже создание обычной формы обратной связи может быть сложным для начинающих, не говоря уже о форме для заказов со всеми необходимыми формулами и логическими цепочками.
• Заказ разработки формы у фрилансеров - отлично подходит для тех, кто дорожит своим временем и/или мало не разбирается в технических аспектах веб-форм. Если по вашему мнению этот способ вам подходит, тогда вы можете смело заказывать форму от uCalc. Поскольку у этой данной биржи фрилансеров много положительных отзывов и выполненных проектов в различных сферах бизнеса.
• Виджеты и плагины для CMS. Многие платформы для управления сайтом снабжены вспомогательными компонентами, называемыми - плагины. Они подключаются к платформе, расширяют ее основные и добавляют новые возможности.
• Использовать конструктор форм - простой, удобный и быстрый способ. Здесь вам не обязательно знать программирование, чтобы сделать все самому.

В данном примере попробуем сделать форму-заказ для продажи пластиковых окон самостоятельно, без использования программирования и для этого найдем подходящий для нас конструктор. В нем должен быть удобный интерфейс, интуитивный функционал, а также простой и красивый дизайн. Наиболее подходящий вариант для нас - это конструктор uCalc. Чтобы сделать форму в нем, необязательно разбираться в области технологий. Кроме того, если вы все же хотите добавить собственный код, можете воспользоваться отдельным виджетом “HTML-код”.

Для создания формы-заказа понадобятся:

• виджеты “Список”, “Галочка”, “Флажок”, “Ползунок”, “Картинка”, “Текст”;
• картинки, либо фото окон;
• поля ввода;
• кнопка “Отправить”.

Начнем с виджетов “Список”. Перетаскиваем два виджета для выбора системы и пакета окон, располагаем их сбоку друг от друга. Редактируем заголовки и пункты. Чтобы увеличить количество пунктов, нажмите плюсик, а чтобы удалить лишние - крестик.

После этого добавим виджет “Флажок”, редактируем аналогично предыдущему пункту. Следом перетаскиваем четыре виджета “Картинка” и выстраиваем их как показано ниже.

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

Далее сделаем так, чтобы клиент смог выбрать необходимые параметры окна. Добавим виджеты “Текст” и “Ползунок”, где выбираем диапазон и шаг.

Помимо характеристик окон, клиенту может понадобится выбрать дополнительные услуги (параметры), поэтому добавим виджеты “Текст” и “Галочка” . “Текст” используется в качестве заголовка. Для того чтобы гармонично смотрелся выбор пунктов, располагаем все три “Галочки” рядом друг с другом и убираем заголовки каждого из них.

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

• для доставки - “Текстовое”;
• для Имя, Фамилия, Отчество “Текстовое”;
• для ввода номера телефона - “Номер телефона”.

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

Далее требуется добавить кнопку для отправки формы-заказа. Перетаскиваем виджет “Кнопка”, редактируем надпись и сообщение об успешной отправке.

Настраиваем уведомления. Вы можете сделать отправку как на номер телефон, так и на email, причем вы можете указать несколько адресатов.

Так будет выглядеть кнопка после отправки заказа:

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

Вот как выглядит готовая форма:

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