Skip to main content
⚠️ Важное уведомление Приведённый ниже сниппет темы применяется к обеим версиям модулей корзины Upcart — он заставляет Shopify отрисовывать кнопки ускоренного оформления заказа на странице, что и нужно Upcart независимо от версии модуля. Селектор .additional-checkout-buttons ниже — это собственный класс Shopify на контейнере ускоренного оформления заказа, а не класс модуля Upcart, поэтому он одинаков в обеих версиях корзины.

​
Обзор

Иногда кнопки экспресс-оформления заказа не нажимаются или не появляются внутри Upcart. Это распространённая проблема, вызванная тем, как Shopify управляет отрисовкой кнопок экспресс-оплаты в темах. В этом руководстве объясняется, почему так происходит и что можно сделать для исправления.

​
Необходимая настройка для нового модуля

⚠️ Важно: эти шаги относятся к новому модулю Express Payments в Upcart, а не к устаревшей версии. Чтобы кнопки экспресс-оформления заказа корректно работали в Upcart, вы должны добавить небольшой фрагмент кода в вашу тему Shopify. Без этого сниппета Shopify не загрузит кнопки оплаты должным образом внутри корзины-шторки. Перед внесением этих изменений убедитесь, что соответствующие способы оплаты (например, Shop Pay, PayPal, Apple Pay, Google Pay) включены в настройках вашей учётной записи в админ-панели Shopify. Без включения этих способов кнопки не будут видны. Кроме того, убедитесь, что сниппет размещён непосредственно под открывающим тегом <body> в файле вашей темы (например, <body class="...">). Если он размещён неправильно, например после закрывающего тега </body>, кнопки экспресс-оформления заказа могут работать некорректно.

​
Как исправить

  1. Перейдите в вашу админ-панель Shopify.
  2. Перейдите в Online Store > Themes > Edit Code.
  3. Откройте layout/theme.liquid, найдите строку <body> и добавьте приведённый ниже сниппет на новой строке непосредственно под ней. Он должен находиться именно там — не в cart-drawer.liquid и не где-либо ещё — потому что кнопки должны существовать на каждой странице, где может открыться корзина.
  1. Сохраните изменения и обновите витрину.
  2. Снова откройте корзину-шторку, чтобы убедиться, что кнопки экспресс-оформления заказа (такие как Shop Pay, PayPal, Apple Pay или Google Pay) теперь появляются и нажимаются.
Полные инструкции по настройке см. в руководстве по модулю Express Payments.

​
Почему это происходит

Кнопки экспресс-оплаты полностью управляются Shopify, а не Upcart. Это означает:
  • Upcart не отрисовывает собственные кнопки. Он клонирует кнопки ускоренного оформления заказа Shopify со страницы в корзину-шторку, поэтому они прежде всего должны присутствовать на странице — именно это гарантирует приведённый выше сниппет темы.
  • Apple Pay будет отображаться только на устройствах Apple с настроенным Apple Pay.
  • Upcart не управляет тем, какие экспресс-кнопки появляются, поскольку содержимое и функциональность обрабатываются Shopify.
🎨 Примечание:
Кнопки в Upcart выступают в роли визуальных контейнеров, а Shopify управляет их отображением и поведением. Upcart не может изменить их внешний вид или функции.

​
Распространённые проблемы и решения

​
1. Кнопки не отрисовываются на странице

Это самая распространённая причина. Upcart клонирует кнопки Shopify со страницы, поэтому если страница их не отрисовывает, клонировать нечего, и корзина показывает пустое место. Что делать:
  • Добавьте сниппет темы из раздела Как исправить выше непосредственно под строкой <body> в layout/theme.liquid.
Не удаляйте собственные экспресс-кнопки вашей темы, чтобы «избежать конфликта». Upcart зависит от их наличия. Удаление их из темы или отключение в настройках темы убирает источник, из которого клонирует Upcart, что усугубляет эту проблему, а не решает её.

​
3. CSS блокирует кнопки

Некоторые темы по умолчанию скрывают экспресс-кнопки с помощью CSS. Например:
Что делать:
  • Проверьте CSS вашей темы.
  • Попросите разработчика вашей темы убедиться, что никакие правила CSS не скрывают и не отключают кнопки в шторке Upcart.

​
4. Мешают устаревшие настройки

Если вы использовали старую версию модуля Express Payments, сохранённые настройки могут конфликтовать с новой конфигурацией. Что делать:
  • Откройте старый модуль Express Payments (если он всё ещё виден).
  • Снимите все ранее установленные флажки и сохраните.
  • Протестируйте снова, используя новый модуль.

​
Проблемы сохраняются?

​
Отключите Shadow DOM в Upcart

В некоторых случаях кнопки экспресс-оплаты могут не загружаться или не обновляться из-за того, что в Upcart включён Shadow DOM. Что такое Shadow DOM?
Shadow DOM изолирует Upcart от остального кода вашего магазина для повышения стабильности. Однако в редких случаях эта изоляция может мешать корректному обновлению экспресс-кнопок Shopify. Как отключить Shadow DOM:
  1. Перейдите в Upcart > Cart Editor > Settings > Cart settings, затем разверните Advanced Settings.
  2. Снимите флажок Render Cart in Shadow DOM.
  3. Сохраните и протестируйте снова.
⚠️ Важно:
Всегда тестируйте корзину после отключения Shadow DOM, так как это может повлиять на взаимодействие других приложений или элементов темы с Upcart. 💡 Примечание: отключение Shadow DOM может решить эту проблему, но может вызвать конфликты CSS с вашей темой. Полное описание компромисса см. в статье Настройка Shadow DOM.

​
Нужна дополнительная помощь?

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

​
Ссылки

  • Справка Shopify — Accelerated Checkouts
  • Документация для разработчиков Shopify — Express Payment Buttons