Как настроить смартфоны и ПК. Информационный портал
  • Главная
  • Безопасность
  • Идеальная форма заказов для интернет-магазина. Простейшая форма отправки данных на почту при помощи HTML и PHP

Идеальная форма заказов для интернет-магазина. Простейшая форма отправки данных на почту при помощи HTML и PHP

Сайты, продающие какие-либо товары, зачастую делаются на специализированных системах(cms). Полноценные интернет-магазины обязаны иметь полнофункциональную корзину и возможность оплатить покупку дистанционно. Но что делать, если ассортимент вашей продукции не такой большой, чтобы разворачивать целый магазин. Что если вы продаёте свою книгу, тренинг или какую-нибудь уникальную методику? Даже если у вас интернет-магазин с полной автоматизацией, кнопка "Купить в несколько кликов" или "Заказать за 5 секунд" будет очень кстати.

Проведённые исследования показывают, что при использовании возможности экспресс-заказов, конверсия увеличивается до +56%. Если считать классическое оформление заказа, то число отказов составляет около 7%. При использовании заказа в 1 клик число отказов достигало 20% (каждый 5-й заказ содержал "липовые" данные покупателей). Несмотря на это, экспресс-заказов было большинство. Это значит, что при правильном использовании этой функции, количество продаж может существенно увеличиться.

Вот как менялось значение конверсии на наших подопытных магазинах в течении месяца на каждом этапе. Вначале была только одна кнопка "В корзину". В первом эксперименте была добавлена ссылка для экспресс-покупки. Результаты были потрясающими. Тогда мы решили на втором эксперименте вынести покупку в 1 клик в основную кнопку, а добавление в корзину опустить в ссылку. Конверсия была выше изначальной, но всё же первый эксперимент оказался более продуктивный. Его мы и советуем нашим клиентам.

  • WIX
Шаг 1. Проектирование формы экспресс-заказа

Рассмотрим готовые формы заказа в один клик из примеров в конструкторе.

Стандартная форма для заказа с сайта. Кнопку на неё или ссылку можно поставить рядом с кнопкой "Добавить в корзину", либо использовать отдельно. В скрытом(невидимом) поле формы будет передано название товара. В этом примере поле товара сделали видимым , чтобы вы смогли проследить за изменением поля. В заготовках конструктора скрытое поле для товаров имеет идентификатор product . Чтобы это поле заполнялось автоматически в зависимости от того, на какую кнопку/ссылку нажали, нужно добавить ссылке или кнопке псевдо-атрибут data-product="Название товара"

Купить iPhone 5S Купить Samsung S5 Купить HTC Desire

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

Создание форм – трудное и отнимающее массу времени дело. Это явно не то занятие, за которым Вы бы хотели просидеть целый рабочий день. В основном, формы используются для реализации обратной связи на сайте и лидогенерации в Landing Page. Более сложные формы часто используют для создания каких-либо анкет, опросников и пр. В ситуации, когда требуется много полей, настройка серверных скриптов займет очень много драгоценного времени. На помощь приходят saas-сервисы. С их помощью, используя встроенный конструктор, можно создать в кратчайший срок форму любой сложности без особых усилий. Если же вы не ищете легких путей, предлагаю использовать скрипт для создания форм, который был ранее опубликован на .
Многие хотят создавать надежные и удобные веб формы быстро, и явно не в ручную. Оказывается, что создание форм с помощью специально разработанного для данного дела конструктора происходит намного легче и быстрее. Они способны создавать за несколько кликов полезные и хорошо оформленные проекты. Правда, некоторые разработчики берут плату за пользование своим ресурсом, но зачастую это стоит того. К тому же она не настолько большая, чтобы особо повлиять на Ваш бюджет. Мы решили немного сэкономить Ваше время и составили список из 13-и самых лучших онлайн конструкторов форм , наделенных огромным числом функций.

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

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

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

iFormbuilderFormBuilde является уникальным сервисом, на основе облачных вычислений он способен по всему миру собирать данные своим клиентам из мобильных устройств. Кроме того, данный конструктор форм может создавать такие элементы, как форму заявок, форму тестирования, форму заказа и подписки. Пользователи практически на ходу способны вводить данные и даже изменять многие параметры. Это идеальный инструмент для вашей работы.

FormbakeryЭто платный, но очень эффективный сервис для создания простых и быстрых форм . Что от вас требуется – перетащить в рабочее поле необходимые элементы (текстовые блоки, кнопки выбора нужных опций, флажки и другое), и ввести адрес, куда вы желаете отправить созданную форму. Генерируемый код, который Вы используете в проектах, читается легко, словно написанный не роботом, а человеком.

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

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

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

FormsSmartsДанный онлайн конструктор форм позволяет создавать отличные формы и публиковать их. Создатели этого сервиса предоставляют несколько способов делиться формами с пользователями мировой сети и получать от них ответы. Большинство клиентов устанавливают их на собственном ресурсе и получают форму ответ по электронной почте или уже сведенные в таблицу серию ответов в виде отчета Excel .

MatchFormMachForm – это ресурс профессионального уровня, он позволяет создавать формы с максимальной совместимостью. Он работает не только на настольных компьютерах, но и подходит для работы на большинстве мобильных / сенсорных устройств ( , Android устройств). Все новые версии Form Builder позволяют легко создавать формы с помощью перетаскивания и вообще без программирования. Он интегрирован с основными платежными системами (PayPal, Authorize.net, Stripe, Braintree ). Всего за несколько кликов мышки пользователь создаст прекрасную форму и сможет отправлять онлайн-заказы или принимать платежи.

Форма состоит из следующих блоков:

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

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

  • Данные покупателя.
    На финальном этапе заказа посетитель при оформлении вводит свои данные. Количество полей и их наименования произвольное и настраивается в личном кабинете сервиса EasyNetShop. При этом у каждого из полей можно установить признак "Обязательное" и форма заказа не будет отправлена до того момента, пока обязательное поле не заполнено.
  • Кнопки управления.
    Покупатель может завершить оформление заказа или вернуться на сайт для добавления в форму дополнительных товаров или услуг.
  • Пример html-кода для добавления корзины
    скопируйте в любое место на странице 1 раз

    Тестовый код для размещения кнопки КУПИТЬ
    разместите рядом с описанием нужного товара Купить

    Готовый персональный код корзины и коды кнопок для добавления в неё товаров в можете получить в личном кабинете:

    Преимущество формы заказа EasyNetShop

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

    Ещё несколько позитивных моментов в форме заказа EasyNetShop:
    • Постоянно напоминает о незавершенном действии по оформлению заказа.
    • Удобно при формировании заказа с мобильных устройств тем, что половина данных (о товаре и количестве) уже автоматически заполнены.
    • Позволяет производить расчет не только суммы заказа, но и стоимости доставки, а также скидку.
    • Сохраняет данные при повторном возвращении на сайт, если заказ не был завершен.
    • Позволяет организовать процесс онлайн-оплаты для сформированного заказа.

    Заполненная и отправленная форма заказа остается формальностью и даже если получен обратный ответ о том, что заявка получена. Это не дает 100%ой уверенности покупателю в том, что именно совершена покупка. Не получив ответа и не понимая стоит ли ему его ждать (какое время) - покупатель продолжит поиск товара на других сайтах. Совсем другое дело, если покупатель оформил заказ через корзину товаров и ему пришел тот же самый автоматический ответ о том, что заказ №… оформлен. Это уже не формальность.

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

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

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

    1. Простота — залог эффективности.

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

    2. Используйте наглядные примеры.

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

    3. Всего показывайте ход оформления заказа вашему клиенту.

    Клиент должен всегда видеть сколько этапов он прошел и сколько ещё предстоит пройти. имеет особое значение с точки зрения психологии. Классическая схема оформления заказа проходит в 3-4 этапа. Первый этап — пользователь составляет список заказа. Второй этап — покупатель вносит свои контактные данные. Третий этап — проверка информации. Четвертый этап — сделка.

    4. Развейте все сомнения клиентов.

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

    5. Нет! регистрациям.

    Практически все покупатели плохо относятся к любой регистрации, в связи с тем, что этот процесс может занять много времени (по их мнению). Поэтому даже если у вас на сайте регистрация осуществляется без подтверждения профиля, удалите её или сделайте процесс оформления заказа доступным для незарегистрированных пользователей. Стоит отметить, что в некоторых случаях регистрация, напротив, необходима. Например, когда вы намерены создать качественную базу клиентов. В этом случае, сделайте регистрацию на сайте через социальные сети. Это очень просто.

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

    Лучшие статьи по теме