Если вы столкнулись с проблемой отсутствия стрелок карусели в модуле апсейлов Upcart, обычно это связано с проблемой совместимости с темой вашего магазина.Чтобы решить её, вы можете вручную добавить стрелки, применив настройку с помощью пользовательского HTML в настройках редактора Upcart.Чтобы получить доступ к полям пользовательского кода в Upcart:Cart Editor > Settings, затем вкладки Custom HTML и Custom CSS. Settings — это строка вкладок; всё, что не помещается, находится за More settings.
Для этого исправления откройте выпадающее меню HTML и выберите «Scripts (before load)», затем вставьте следующий код в этот раздел:
<script> window.upcartSubscribeCartOpened(() => { setTimeout(() => { // The cart may render inside a shadow root, where document.querySelector // cannot reach it. Search the shadow root when there is one. const host = document.getElementById('upCart'); const scope = host?.shadowRoot ?? document; const buttonLeft = scope.querySelector('.control-arrow.control-prev'); if (buttonLeft) buttonLeft.innerText = "<"; const buttonRight = scope.querySelector('.control-arrow.control-next'); if (buttonRight) buttonRight.innerText = ">"; }, 300); });</script>
Не используйте здесь голый document.querySelector. В большинстве магазинов Upcart отрисовывается внутри shadow root (это значение по умолчанию для новых установок), а document.querySelector не может заглянуть внутрь него — скрипт ничего не найдёт и без проверок if выбросит ошибку на null. Строка host?.shadowRoot ?? document выше работает в обоих случаях.
Примечание об устаревших функциях: колбэки window.upcartOnCartOpened по-прежнему работают, но являются устаревшими и выводят предупреждения в консоль. Используйте upcartSubscribeCartOpened во всех новых скриптах.
Вот как должны выглядеть ваши настройки пользовательского HTML в Upcart:
Мы часто используем псевдоэлементы CSS (::before), содержащиеся внутри кнопок, для отображения стрелок карусели. Однако некоторые темы магазинов блокируют отрисовку псевдоэлементов, из-за чего стрелки карусели исчезают из корзины-шторки.Это создаёт ситуацию, когда стрелки карусели апсейлов корректно отображаются в предпросмотре редактора, но не в реальной действующей витрине.
Была ли эта страница полезной?
⌘I
Assistant
Responses are generated using AI and may contain mistakes.