Некоторые из наших читателей спрашивали, как создать форму онлайн-заказа, чтобы клиенты могли легко размещать свои заказы на сайте.
Если у вас есть бизнес, например, ресторан или физический магазин, возможно, вы не захотите создавать целый интернет-магазин. Однако, возможно, вы захотите предложить клиентам простой способ заказать еду или другие товары для доставки.
В этом посте мы покажем вам, как создать форму онлайн-заказа в WordPress. Это позволит вам легко собирать заказы клиентов без добавления полноценного программного обеспечения для электронной коммерции на ваш сайт.
Если вы предпочитаете письменные инструкции, просто продолжайте читать.
Создание формы онлайн-заказа в WordPress
Возможно, вы недавно решили создать веб-сайт для своего бизнеса, и вы чувствуете себя немного подавленным.
Многие предприятия открывают интернет-магазин, чтобы не только собирать заказы, но и принимать платежи и управлять инвентарем. Однако не всем предприятиям нужен полноценный сайт электронной коммерции.
Если вам нужно, чтобы клиенты могли заполнить только форму онлайн-заказа, то вы можете легко создать ее без использования корзины покупок.
Простая форма онлайн-заказа дает вам возможность принимать платежи онлайн, при получении заказа или при доставке.
В этом руководстве мы будем использовать WPForms для создания формы онлайн-заказа, потому что он позволяет легко сделать это с помощью интерфейса drag & drop.
WPForms — лучший плагин WordPress для построения форм на рынке. Более 3 миллионов сайтов используют WPForms, чтобы легко создать любую онлайн-форму и добавить ее на свой сайт (никаких навыков кодирования не требуется).
Во-первых, вам нужно установить и активировать плагин WPForms. Нужна помощь в установке плагина? Смотрите наше руководство по установке плагина WordPress для получения подробных инструкций.
Плагины — это как приложения для вашего сайта WordPress. Если вы новичок в WordPress, то ознакомьтесь с нашей статьей о том, что такое плагины WordPress и что с их помощью можно делать.
После активации плагина WPForms вы увидите новую вкладку WPForms в боковой панели администратора вашей приборной панели WordPress.
Вам нужно посетить WPForms » Настройки страницу для ввода лицензионного ключа. Вы можете найти эту информацию в вашем аккаунте на сайте WPForms.
Теперь вы готовы к созданию формы онлайн-заказа.
Просто перейдите по адресу WPForms » Add New страница для создания вашей первой формы.
Теперь вы увидите экран создания формы. Введите название вашей формы и выберите шаблон. Мы рекомендуем шаблон ‘Billing / Order Form’.
Просто наведите курсор на описание шаблона и нажмите кнопку «Создать форму выставления счета/заказа».
Ваша форма будет создана автоматически, и вы попадете прямо в редактор форм WPForms.
Теперь вы можете редактировать свою форму онлайн-заказа как угодно. Различные части формы называются «полями». Вы можете изменять, добавлять или удалять поля формы одним щелчком мыши.
Шаблон по умолчанию уже содержит поля для большинства необходимых сведений, таких как имя, адрес и номер телефона. Однако вам нужно будет перечислить ваши реальные продукты.
Нажмите на поле «Доступные товары», чтобы отредактировать его.
Введите название и цену каждого из товаров, которые клиенты могут заказать у вас. Цена не будет автоматически отображаться в форме, поэтому вы можете добавить ее в название товара.
Чтобы добавить дополнительные опции, просто нажмите на значок (+) там, где вы хотите добавить дополнительные элементы.
Примечание: Вы можете добавить столько товаров, сколько хотите. Однако покупатели смогут выбрать только один вариант из этого поля.
Если у вас несколько категорий вариантов, то вы можете скопировать поле для создания групп.
Вы можете скопировать поле ‘Available Items’, нажав на иконку ‘Copy’, которая появляется при наведении курсора или когда поле выделено.
Убедитесь, что вы изменили ‘Label’ полей на что-то подходящее для каждой группы.
Если вы хотите, чтобы покупатели могли выбрать два или более варианта в одном поле, вам нужно использовать другой тип поля.
Нажмите на вкладку «Добавить поля», затем прокрутите вниз до «Полей оплаты», где вы найдете поле «Элементы флажка». Перетащите их в нужное место на форме.
Теперь вы можете редактировать это поле, как и раньше, вводя названия и цены для ваших товаров. Клиенты могут отметить столько товаров, сколько они хотят заказать.
Если вы хотите показать изображения ваших товаров, это тоже очень просто. Просто нажмите на флажок «Использовать варианты изображений»:
Для каждого товара нажмите кнопку «Загрузить изображение», чтобы добавить изображения с вашего компьютера или из медиатеки WordPress.
Ваши изображения не будут уменьшены или сжаты WPForms, поэтому важно загрузить их в нужном размере. Все они должны быть одинакового размера и не более 250×250 пикселей.
Наконец, вы можете отредактировать поле ‘Комментарий или сообщение’ в нижней части формы, чтобы оно не было обязательным. Не все пользователи захотят добавить сообщение.
Просто нажмите на поле, а затем снимите флажок «Обязательно» справа, чтобы сделать это поле необязательным.
Вы можете следовать этому процессу для любого поля, которое вы хотите сделать необязательным. Вы можете определить, какие поля являются обязательными, потому что они будут иметь красную звездочку рядом с надписью поля.
Как только вы будете довольны дизайном формы, вы можете перейти к настройке ее параметров. Хорошо бы сначала сохранить форму, нажав на кнопку «Сохранить» в верхней части экрана:
Настройка уведомлений, которые будет рассылать ваша форма заказа
Сначала перейдите на вкладку ‘Настройки’ в левой части экрана. Откроются настройки вашей формы.
Далее перейдите на вкладку «Уведомления», чтобы изменить уведомления по электронной почте для вашей формы. По умолчанию заполненные формы заказов будут отправляться по электронной почте на адрес администратора вашего сайта WordPress.
Возможно, вы захотите изменить это или скопировать формы заказа на несколько адресов. Вы можете просто ввести адрес или адреса электронной почты в поле «Отправить на адрес электронной почты». Если вы вводите несколько адресов электронной почты, разделяйте их запятой.
Возможно, вы также захотите изменить тему письма, чтобы она не была одинаковой для каждого заказа. Это может облегчить отслеживание заказов в переполненном почтовом ящике.
Здесь мы изменили тему письма на «Заказ от клиента», а затем имя клиента. Мы использовали ‘Show Smart Tags’ для вставки поля имени в строку темы.
Вы также можете изменить любую другую информацию по своему усмотрению.
Мы также настоятельно рекомендуем настроить уведомление по электронной почте для ваших клиентов. Это напомнит им о том, что они заказали, и даст им знать, что вы получили их заказ.
Чтобы настроить новое уведомление по электронной почте, нажмите кнопку «Добавить новое уведомление».
Вам будет предложено ввести имя для нового уведомления. Вы можете назвать его как угодно, поскольку клиенты не увидят это имя. Мы предлагаем что-то вроде «Квитанция для клиента» или «Подтверждение электронной почты клиента».
Вы хотите, чтобы в качестве ‘Send To Email Address’ был указан электронный ящик вашего клиента. Удалить из этого поля. Нажмите «Показать смарт-теги» и выберите поле «Электронная почта».
Вы также захотите ввести другие данные для электронной почты. Мы рекомендуем использовать тему сообщения, например, «Ваш заказ с» и название вашей компании.
В поле «Сообщение» вы, вероятно, захотите добавить сообщение для вашего клиента. В метке будет указана вся информация, которую клиент ввел в форму.
Что если вы хотите включить в электронное письмо только часть информации о клиенте?? Или что если вы хотите поместить детали заказа первыми и включить данные о доставке в конце письма?? Вы можете просто использовать Smart Tags для добавления любых полей формы в вашу форму.
Закончив настройку уведомлений, нажмите кнопку «Сохранить» в верхней части экрана.
Совет: Чтобы вернуться к первому уведомлению, которое вы редактировали, просто прокрутите экран вниз.
Настройка сообщения подтверждения для ваших клиентов
Наряду с отправкой клиентам квитанции по электронной почте, вы должны показать им подтверждение на экране, чтобы они знали, что их заказ отправлен.
Вы можете сделать это под Настройки » Подтверждение вкладка.
Подтверждение по умолчанию гласит: «Спасибо, что связались с нами! Мы свяжемся с вами в ближайшее время.»
Вы можете изменить это поле на любое другое, и вы можете использовать визуальный редактор для форматирования текста.
В качестве альтернативы вы можете перенаправить клиентов на страницу «Спасибо» на вашем сайте или даже на другой сайт.
После того как вы настроите сообщение подтверждения, нажмите «Сохранить» в верхней части экрана.
Интеграция оплаты с формой заказа (необязательно)
Если вы хотите принимать оплату через форму заказа, то вам нужно будет интегрировать ее с платежным процессором.
WPForms очень легко интегрируется с двумя популярными платежными процессорами, PayPal и Stripe. Клиенты могут оплатить либо через свой счет PayPal, либо введя данные своей кредитной карты.
В этом учебнике мы будем использовать PayPal, но процесс для Stripe аналогичен.
Сначала вам нужно выйти из конструктора форм. Вы можете сделать это, нажав на ‘X’ в правом верхнем углу. Вам будет предложено сохранить форму, если у вас есть несохраненные изменения.
Далее, перейдите в раздел WPForms » Аддоны на странице в панели управления WordPress. Прокрутите вниз до ‘PayPal Standard Addon’ и нажмите кнопку ‘Install Addon’ под ним.
После этого аддон будет установлен и активирован автоматически.
Вернитесь к своей форме, которую вы можете найти в разделе WPForms » Все формы. Теперь перейдите на вкладку «Платежи».
Нажмите на ‘PayPal Standard’ и заполните данные формы. Сначала вам нужно установить флажок «Включить стандартные платежи PayPal» и ввести адрес электронной почты PayPal вашего предприятия.
Оставьте для выпадающего списка «Режим» значение «Производство», а для «Типа оплаты» — «Товары и услуги».
Если вы собираете адрес доставки через форму заказа, то вы можете изменить «Доставка» на «Не запрашивать адрес».’
Вам не нужно вводить «URL отмены», но вы можете создать на своем сайте страницу, на которую будут отправляться покупатели, если они не завершат процесс оформления заказа.
Нажмите кнопку «Сохранить», когда закончите работу.
Теперь, когда пользователь отправит форму, он будет автоматически перенаправлен на PayPal для оплаты. Вам не нужно добавлять дополнительные поля в форму или делать что-либо еще.
Добавление формы заказа на ваш сайт
Последний шаг — добавить форму заказа на ваш сайт.
Просто выберите страницу, на которую вы хотите добавить свою форму, или создайте новую страницу в разделе Страницы » Добавить новый.
Далее нажмите на значок (+), чтобы добавить новый блок (где бы вы ни хотели разместить форму) и найдите блок ‘WPForms’. Она находится в разделе блоков ‘Виджеты’, или вы можете просто ввести ‘WPForms’ в строке поиска, чтобы найти ее.
Вы увидите блок WPForms. Нажмите на выпадающий список «Выбрать форму» и выберите вашу форму.
Затем вы увидите предварительный просмотр самой формы в редакторе WordPress.
Когда вы будете готовы, сохраните и опубликуйте (или обновите) вашу страницу. Вы можете просмотреть его в реальном времени на вашем сайте, чтобы увидеть вашу форму в действии. Прежде чем предоставить форму клиентам, мы рекомендуем протестировать ее, чтобы убедиться, что она работает так, как вы ожидаете.
Также не лишним будет проверить, что вы получаете уведомление по электронной почте, когда форма отправлена. Если нет, ознакомьтесь с нашей статьей о том, как исправить проблему WordPress, не отправляющую электронную почту.
Даже если вы пропустите письмо или случайно удалите его, WPForms сохранит данные формы в базе данных WordPress. Вы можете найти все свои заказы, перейдя по ссылке WPForm » Записи в вашей приборной панели WordPress.
Нажмите на название вашей формы, и вы увидите список записей. Вы можете нажать ‘View’ рядом с любой из этих форм, чтобы увидеть подробности.
Вот и все! Надеемся, что эта статья помогла вам узнать, как создать форму онлайн-заказа в WordPress. Вам также может понравиться наш гид по лучшим телефонным службам для бизнеса и обязательные плагины WordPress для малого бизнеса.
Источник: www.wpbeginner.com