Несколько наших читателей спрашивали, как создать онлайн-форму заказа, чтобы клиенты могли легко размещать свои заказы на сайте.
Если вы управляете бизнесом, например, рестораном или физическим магазином, возможно, вы не захотите создавать целый интернет-магазин. Однако вы можете предложить клиентам простой способ заказать еду или другие товары для доставки.
В этом посте мы собираемся показать вам, как создать онлайн-форму заказа в WordPress. Это позволит вам легко собирать заказы клиентов без добавления полноценного программного обеспечения для электронной коммерции на ваш сайт.
^
Создание онлайн-формы заказа в WordPress
Возможно, вы недавно решили создать веб-сайт для своего бизнеса, и вы чувствуете себя немного ошеломленным.
Многие предприятия открывают интернет-магазин, чтобы не только собирать заказы, но и принимать платежи и управлять запасами. Однако не всем компаниям нужен полный веб-сайт электронной коммерции.
Если вы хотите, чтобы клиенты могли заполнять онлайн-форму заказа, вы можете легко создать ее без решения для корзины покупок.
Простая онлайн-форма заказа дает вам возможность принимать платежи онлайн, при получении заказа или при доставке.
В этом руководстве мы будем использовать WPForms для создания онлайн-формы заказа, потому что это позволяет вам легко сделать это с помощью интерфейса перетаскивания.
WPForms – лучший плагин WordPress для создания форм на рынке. Более 3 миллионов веб-сайтов используют WPForms для простого создания любой онлайн-формы и добавления ее на свой сайт (не требуются навыки кодирования).
Во-первых, вам нужно установить и активировать плагин WPForms. Нужна помощь в установке плагина? Смотрите наше руководство о том, как установить плагин WordPress для получения подробных инструкций.
Плагины похожи на приложения для вашего сайта WordPress. Если вы новичок в WordPress, взгляните на нашу статью о том, что такое плагины WordPress и что вы можете с ними делать.
Активировав плагин WPForms, вы увидите новую вкладку WPForms на боковой панели администратора панели управления WordPress.
Вам необходимо зайти на страницу WPForms »Настройки, чтобы ввести свой лицензионный ключ. Вы можете найти эту информацию в своей учетной записи на сайте WPForms.
^
Теперь вы готовы создать онлайн-форму заказа.
Просто зайдите на WPForms »Добавить новую страницу, чтобы создать свою первую форму.
^
Теперь вы увидите экран создания формы. Введите имя для вашей формы и выберите шаблон. Мы рекомендуем использовать шаблон «Биллинг / Форма заказа».
^
Просто наведите курсор на описание шаблона и нажмите кнопку «Создать форму для выставления счета / заказа».
^
Ваша форма будет автоматически создана для вас, и вы попадете прямо в редактор форм WPForms.
^
Теперь вы можете редактировать свою онлайн-форму заказа, как вы хотите. Различные части формы называются «полями». Вы можете изменить, добавить или удалить поля в вашей форме одним щелчком мыши.
Шаблон по умолчанию уже содержит поля для большей части информации, которая вам может понадобиться, например, имя, адрес и номер телефона. Тем не менее, вам нужно будет перечислить ваши фактические продукты.
Нажмите на поле «Доступные элементы», чтобы изменить его.
^
Введите название и цену каждого товара, который клиенты могут заказать у вас. Цена не будет автоматически отображаться в форме, поэтому вы можете добавить это в название товара.
^
Чтобы добавить дополнительные параметры, просто нажмите значок (+), где бы вы ни хотели добавить дополнительные элементы.
^
Примечание. Вы можете добавить столько элементов, сколько захотите. Однако клиенты смогут выбрать только один вариант из этого поля.
Если у вас есть несколько категорий параметров, вы можете скопировать поле для создания групп.
Вы можете скопировать поле «Доступные элементы», щелкнув значок «Копировать», который появляется при наведении на него курсора или при его выборе.
^
Убедитесь, что вы изменили «Метка» полей на что-то подходящее для каждой группы.
Если вы хотите, чтобы клиенты могли выбирать два или более параметров в одном поле, вам нужно использовать другой тип поля.
Нажмите на вкладку «Добавить поля», затем прокрутите вниз до «Поля оплаты», где вы найдете поле «Элементы-флажки». Перетащите это в положение на вашей форме.
^
Теперь вы можете редактировать это поле, как и раньше, вводя названия и цены для ваших товаров. Клиенты могут проверить столько товаров, сколько они хотят заказать.
Если вы хотите показать изображения своих продуктов, это тоже очень просто. Просто нажмите на поле «Использовать выбор изображений»:
^
Для каждого элемента нажмите кнопку «Загрузить изображение», чтобы добавить изображения со своего компьютера или из медиатеки WordPress.
^
Ваши изображения не будут изменены или сжаты WPForms, поэтому важно загружать их в нужном размере. Все они должны быть одинакового размера и не более 250 × 250 пикселей.
В идеале вы также должны оптимизировать свои изображения для Интернета.
Наконец, вы можете отредактировать поле «Комментарий или сообщение» внизу формы, чтобы оно не требовалось. Не все пользователи захотят добавить сообщение.
Просто щелкните поле и снимите флажок «Обязательно» справа, чтобы сделать это поле необязательным.
^
Вы можете следовать этому процессу для любого поля, которое вы хотите, чтобы быть необязательным. Вы можете указать, какие поля являются обязательными, потому что они имеют красную звездочку рядом с меткой поля.
Если вы довольны дизайном своей формы, вы можете перейти к настройке ее параметров. Рекомендуется сначала сохранить форму, нажав кнопку «Сохранить» в верхней части экрана:
^
Настройка уведомлений, которые будет отправлять ваша форма заказа
Сначала нажмите вкладку «Настройки» в левой части экрана. Это откроет настройки вашей формы.
^
Затем перейдите на вкладку «Уведомления», чтобы изменить уведомления электронной почты в форме. По умолчанию заполненные формы заказа будут отправлены по электронной почте на адрес администратора вашего сайта WordPress.
Возможно, вы захотите изменить это или скопировать формы заказа на несколько адресов. Вы можете просто ввести адрес электронной почты или адреса в поле «Отправить на адрес электронной почты». Если вы вводите более одного адреса электронной почты, разделяйте их запятыми.
^
Вы также можете изменить строку темы, чтобы она не была одинаковой для каждого заказа. Это может упростить отслеживание заказов в переполненном почтовом ящике.
Здесь мы изменили тему письма на «Заказ клиента из», а затем имя клиента. Мы использовали «Показать смарт-теги», чтобы вставить поле имени в строку темы.
^
Вы можете изменить любые другие детали, которые вы хотите тоже.
Мы также настоятельно рекомендуем настроить уведомление по электронной почте для ваших клиентов. Это дает им напоминание о том, что они заказали, и позволяет им знать, что вы получили их заказ.
Чтобы настроить уведомление по электронной почте, нажмите кнопку «Добавить новое уведомление».
^
Вам будет предложено ввести имя для нового уведомления. Вы можете называть это как хотите, так как клиенты не увидят это имя. Мы предлагаем что-то вроде «Квитанция клиента» или «Подтверждение электронной почты клиента».
^
Вы хотите, чтобы адресом «Отправить на электронную почту» была учетная запись электронной почты вашего клиента. Удалить {admin_email} из этого поля. Нажмите «Показать смарт-теги» и выберите поле «Электронная почта».
^
Вы также хотите ввести другие данные для электронной почты. Мы предлагаем использовать строку темы, такую как «Ваш заказ с» и название вашей компании.
^
В поле «Сообщение» вы, вероятно, захотите добавить сообщение своему клиенту. Тег {all_fields} предоставит всю информацию, введенную клиентом в форму.
^
Что если вы хотите включить в электронную почту только часть информации о клиенте? Или что, если вы хотите сначала указать детали их заказа и указать их данные о доставке в конце письма? Вы можете просто использовать смарт-теги, чтобы добавить любые поля формы в форму.
Закончив настройку уведомлений, нажмите кнопку «Сохранить» в верхней части экрана.
Совет: чтобы вернуться к первому уведомлению, которое вы редактировали, просто прокрутите экран вниз.
Настройка сообщения подтверждения для ваших клиентов
Наряду с отправкой вашим клиентам квитанции по электронной почте, вы захотите показать им на экране подтверждение, чтобы они знали, что их заказ был отправлен.
Вы можете сделать это в меню «Настройки» на вкладке «Подтверждение».
Подтверждение по умолчанию гласит «Спасибо, что связались с нами! Мы свяжемся с вами в ближайшее время.
^
Вы можете изменить это на что угодно, и вы можете использовать визуальный редактор здесь для форматирования вашего текста тоже.
^
Кроме того, вы можете перенаправить клиентов на страницу «Спасибо» на вашем сайте или даже на другой сайт в целом.
После настройки подтверждающего сообщения нажмите «Сохранить» в верхней части экрана.
Интеграция оплаты с вашей формой заказа (необязательно)
Если вы хотите принять оплату через форму заказа, вам нужно будет интегрировать ее с обработчиком платежей.
WPForms очень легко интегрируется с двумя популярными платежными процессорами, PayPal и Stripe. Клиенты могут платить либо через свой счет PayPal, либо введя данные своей кредитной карты.
Мы собираемся использовать PayPal в этом руководстве, но процесс для Stripe аналогичен.
Во-первых, вам нужно выйти из конструктора форм. Вы можете сделать это, нажав «X» в правом верхнем углу. Вам будет предложено сохранить форму, если у вас есть несохраненные изменения.
Затем перейдите на страницу WPForms »Addons на панели инструментов WordPress. Прокрутите вниз до «Стандартного дополнения PayPal» и нажмите кнопку «Установить надстройку» под ним.
^
Аддон будет установлен и активирован автоматически.
Вернитесь к своей форме, которую вы можете найти в разделе WPForms »Все формы. Теперь нажмите на вкладку «Платежи».
^
Нажмите «PayPal Standard», затем заполните данные формы. Во-первых, вам необходимо установить флажок «Включить стандартные платежи PayPal» и ввести адрес электронной почты PayPal вашей компании.
Оставьте в раскрывающемся списке «Режим» значение «Производство», а в поле «Тип платежа» – «Продукты и услуги».
^
Если вы собираете адрес доставки через форму заказа, вы можете изменить «Доставка» на «Не запрашивать адрес».
Вам не нужно вводить «Отмена URL», но вы можете создать страницу на своем веб-сайте для клиентов, которые будут отправлены, если они не завершат процесс оформления заказа.
Нажмите кнопку «Сохранить», как только вы закончите.
Теперь, когда пользователь отправляет форму, он автоматически направляется в PayPal для оплаты. Вам не нужно добавлять какие-либо дополнительные поля в форму или делать что-либо еще.
Добавление формы заказа на ваш сайт
Последний шаг – добавить форму заказа на ваш сайт.
Просто выберите страницу, на которую вы хотите добавить форму, или создайте новую страницу в разделе Страницы »Добавить новую.
Затем нажмите на значок (+), чтобы добавить новый блок (там, где вы хотите свою форму) и найдите блок «WPForms». Он расположен в разделе блоков «Виджеты», или вы можете просто ввести «WPForms» в строку поиска, чтобы найти его.
^
Вы увидите блок WPForms. Нажмите «Выбрать форму» и выберите свою форму.
^
Затем вы увидите предварительный просмотр самой формы в редакторе WordPress.
Когда вы будете готовы, сохраните и опубликуйте (или обновите) свою страницу. Вы можете просмотреть его вживую на своем сайте, чтобы увидеть свою форму в действии. Перед тем как поделиться ею с клиентами, мы рекомендуем проверить форму, чтобы убедиться, что она работает так, как вы ожидали.
Также рекомендуется проверить, что вы получаете уведомление по электронной почте при отправке формы. Если нет, ознакомьтесь с нашим сообщением о том, как исправить WordPress, не отправляя проблему с электронной почтой.
Даже если вы пропустили письмо или случайно удалили его, WPForms сохраняет данные формы в базе данных WordPress. Вы можете найти все свои заказы, зайдя в WPForm »Записи в панели управления WordPress.
Нажмите на название вашей формы, и вы увидите список записей. Вы можете нажать «Просмотр» рядом с любым из них, чтобы увидеть подробности.
^
Это оно! Мы надеемся, что эта статья помогла вам узнать, как создать онлайн-форму заказа в WordPress. Вам также может понравиться наше руководство по лучшим услугам бизнес-телефонии, а также наличие плагинов WordPress для малого бизнеса.
