Кейс:

Доработка оформления заказа WooCommerce

В прошлом году к нам обратился Роман, владелец интернет-магазина SadhuDesk. Роман искал специалиста для реализации его задумки – разделить экран оформления заказа на своём сайте.

Сайт интернет-магазина работает на CMS WordPress с плагином WooCommerce. Основным направлением деятельности является продажа досок садху для практики стояния на гвоздях.

WooCommerce Каталог
Каталог интернет-магазина SadhuDesk

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

Проблемы

Основными проблемами клиент обозначил:

  1. Неудобная форма оформления заказа.
  2. На смартфонах экран оформления заказа длинный и разрозненный.
  3. Если клиент недооформил заказ, то с ним невозможно связаться.

В процессе брифинга также выяснилось, что в оформлении заказа задействованы 2 плагина расчëта доставки: СДЭК и Почта России. Визуальное представление этих плагинов тоже необходимо скорректировать.

WooCommerce Оформление заказа Стандартный экран
Стандартный экран оформления заказа WooCommerce

Решение

В процессе обсуждения перебрали с заказчиком много вариантов решения проблем, и остановились на следующем:

  1. Разделить экран оформления заказа на 3 шага: Контактные данные, Адрес доставки/получения и Оплата заказа.
  2. После перехода на второй шаг сохранить введëнные данные клиента для просмотра в панели управления.
  3. На экране «Адрес доставки» отображать поля по мере заполнения данных и выбора метода доставки.
  4. Для метода доставки «Пункт выдачи СДЭК» отображать карту с пунктами самовывоза.

Результат

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

WooCommerce Оформление заказа Шаг 1
На первом шаге покупатель заполняет контактную информацию.
WooCommerce Оформление заказа Шаг 2
Покупатель указывает своë местоположение и выбирает метод доставки на втором шаге.
WooCommerce Оформление заказа Шаг 3
На завершающем этапе покупатель выбирает способ оплаты и сохраняет заказ.

Этот заказ был оформлен на платформе KWORK, где, по окончанию работ, Роман оставил нам положительный отзыв.

Если у вас тоже есть подобная задача – обращайтесь, сделаем в лучшем виде! 🙂

Многолетний опыт позволяет нам реализовывать сложные и нестандартные решения.

CMS WordPress
Доработка сайта
Кейс