Интеграция локеров easybox Sameday в оформление заказа Shopify: как разместить карту

Вы хотите, чтобы при оформлении заказа клиент открыл карту, нашёл ближайший локер easybox Sameday и выбрал его одним кликом. На WooCommerce это почти тривиально. На Shopify всё иначе: страница оформления заказа гораздо более закрыта, и если вы просто попытаетесь вставить в неё код карты, вы упрётесь в стену.

Хорошая новость в том, что это выполнимо — но зависит от вашего тарифа Shopify и, главное, от того, где вы размещаете карту. В этом руководстве я покажу три реальных варианта, как на самом деле работает карта локеров Sameday и ту часть, которую многие забывают: как сделать так, чтобы выбранный клиентом локер действительно попал в транспортную накладную. Без обещаний «идеального plug and play».

Почему оформление заказа Shopify не ведёт себя как WooCommerce

Вот в чём суть. Старый файл checkout.liquid, куда можно было вставить любой код, выведен из употребления. На стандартных тарифах Shopify нативная страница оформления заказа практически бронирована: вы не можете свободно вставлять в неё JavaScript или карту.

Единственный способ разместить реальные компоненты прямо на странице оформления — это Checkout UI Extensions, и они доступны только на Shopify Plus. Страницы «Спасибо» и «Статус заказа» принимают расширения на всех тарифах, но там уже слишком поздно: клиент оплатил и больше не выбирает способ доставки.

Практический вывод: для большинства магазинов не на Plus карта локеров НЕ находится на нативной странице оформления. Она размещается до неё или через отдельное приложение.

Три реальных места для размещения карты

Есть три подхода, которые действительно работают в продакшене:

• На странице корзины или товара (самый частый): виджет с картой, где клиент выбирает easybox до входа в оформление. Работает на любом тарифе Shopify.
• На странице оформления, но только на Shopify Plus: Checkout UI Extension, которая показывает кнопку «Выбрать easybox» и открывает карту в модальном окне.
• Через приложение из App Store, которое добавляет easybox как пункт выдачи, используя нативный механизм пунктов выдачи Shopify.

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

Как выглядит карта Sameday и откуда берутся локеры

Sameday предоставляет и виджет/плагин локеров с интерактивной картой, и своё API (то же, что используется для генерации накладных). У вас два пути: использовать их готовый виджет или построить свою карту.

Если идёте по кастомному пути, шаги такие:

• Аутентификация по токену: получите учётные данные API из вашего курьерского аккаунта и запросите токен.
• Запросите список локеров easybox с эндпоинта геолокации. Каждый локер приходит с id, названием, адресом, городом и координатами.
• Разместите точки на карте (Leaflet или Google Maps) или дайте виджету Sameday сделать это.

Две важные детали: убедитесь, что подтягиваете и локеры next-gen (новые), и кэшируйте список — он меняется редко, так что нет смысла запрашивать его при каждой загрузке страницы.

То, что многие забывают: довести локер до накладной

Карта — это только половина дела. Если выбранный клиентом локер не доходит до курьера, вы сделали красивый, но бесполезный виджет.

Механизм на Shopify:

• Когда клиент выбирает локер, вы сохраняете его id, название и адрес.
• На странице корзины вы храните их как атрибуты корзины через вызов /cart/update.js (например, easybox_id, easybox_name) или как свойство позиции заказа.
• Так они появляются в заказе, и вы видите их в админке по каждому заказу.
• При отправке генерация накладной Sameday передаёт код локера как пункт доставки на сервисе easybox.

Курьерские коннекторы для Румынии — Innoship, EasySales, ShippyPro и другие — автоматически считывают этот атрибут и создают накладную. Без этого шага выбранный локер остаётся просто текстом в заказе и ничего не говорит курьеру.

Готовое приложение против кастомного решения

Единственно правильного ответа нет — всё зависит от магазина.

• Приложение из App Store: быстрый старт, ежемесячная подписка, но меньше контроля над дизайном карты и привязка к поставщику.
• Кастомное решение (виджет + API): полный контроль, идеально встроено в ваш брендинг, но требует разработки и поддержки (токены, обновления API, синхронизация локеров).

Для многих магазинов выигрышная комбинация проста: румынское курьерское приложение (Innoship или EasySales) для накладных плюс виджет локеров на странице корзины. Относитесь скептически к любым обещаниям «устанавливается за пять минут и работает идеально» — всегда тестируйте на реальных заказах, прежде чем выпускать клиентов.

В MPO Web Studio мы делаем именно такую интеграцию удалённо для магазинов по всей стране. Мы можем подготовить бесплатное демо на вашем собственном потоке, чтобы вы увидели карту в работе, прежде чем что-то решать. Одно сообщение в WhatsApp — и мы всё организуем.