Все для начинающих интернет-предпринимателей

Как создать пользовательские поля оформления заказа в WooCommerce

WooCommerce-Checkout-FieldsПриветствуем вас! Превратить сайт в полнофункциональный интернет-магазин очень просто, с использованием WooCommerce. Более подробно вы можете прочитать в нашей предыдущей статье. Если у вас уже есть магазин на WooCommerce, то вы наверняка знаете насколько важна страница оформления заказа, а это одна из самых важных частей каждого магазина.

Что такое страница оформления заказа?

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

В этой статье мы хотим показать вам, как создать пользовательские поля при оформлении заказа. А понадобится нам очень простой плагин плагин для WooCommerce Checkout Field Editor.

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

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

Установка и настройка плагина Checkout Field Editor

Checkout Field Editor предоставляет простой способ настройки (добавления, редактирования, удаления и изменения порядка отображения) полей, отображаемых на странице оформления заказа WooCommerce. Итак, скачиваем, устанавливаем и активируем плагин. Далее, перейдите в WooCommerce-Checkout Fields.

WooCommerce-Checkout-Fields-1

 

Теперь, чтобы добавить новое поле, выберите тип поля, укажите метку и нажмите кнопку «Добавить поле».

WooCommerce-Checkout-Fields-3

Идентификаторы полей проверки

При управлении полями оформления заказа вам потребуются соответствующие идентификаторы полей оформления заказа. Вот полный список всех идентификаторов полей соответственно:

Платежные поля

shipping_first_name
shipping_last_name
транспортная компания
shipping_country
shipping_address_1
shipping_address_2
shipping_city
shipping_state
shipping_postcode

Поля доставки

billing_first_name
billing_last_name
billing_company
страной плательщика
Платежный адрес 1
billing_address_2
billing_city
billing_state
billing_postcode
billing_phone
billing_email

Поля заказа

order_comments

Поля аккаунта

account_username
пароль от аккаунта

Конфигурация полей

Общие настройки

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

WooCommerce-Checkout-Fields-4

Вы можете включить или отключить любое поле. Да, вы также можете отключить стандартные поля WooCommerce. Кроме того, вы можете установить поле по мере необходимости. Таким образом, клиент не сможет сделать заказ, не взаимодействуя с полем. Для взаимодействия с полем даты — установка даты, для текстового поля — предоставление текста и т. д.

Проверка

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

WooCommerce-Checkout-Fields-5

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

Установите свой собственный класс CSS

Вы можете изменить способ отображения полей в вашем магазине. Просто перейдите на вкладку «Внешний вид» в настройках поля. Вы можете установить свои собственные классы CSS здесь:

WooCommerce-Checkout-Fields-6

Где отобразить поле

WooCommerce-Checkout-Fields-7

Вы можете настроить, где плагин должен отображать поле. По умолчанию отображается поле:

  • Страница благодарности
  • Моя учетная запись — вкладка адреса
  • Моя учетная запись — вкладка «Заказы»
  • В письмах (о заказах)

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

Вы можете добывить три типа поля:

Однострочный текст

WooCommerce-Checkout-Fields-8

Текст абзаца

WooCommerce-Checkout-Fields-9

Флажок

WooCommerce-Checkout-Fields-10

Но это еще не все. Вы можете скачать плагин woocommerce-checkout-field-editor pro совершенно бесплатно! Ну что вот и все. Из этой статьи вы узнали, как настроить настраиваемые поля WooCommerce при оформлении заказа. А у нас на этом все. Всем пока!

С уважением Вячеслав и Валерия!

Понравился материал? Поделитесь с друзьями!

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

Ваш e-mail не будет опубликован. Обязательные поля помечены *