Обзор

Если вы предлагаете вознаграждения только в определённых регионах, вы можете скрыть панель вознаграждений от покупателей из определённых стран, используя комбинацию JavaScript и CSS. Это помогает поддерживать корзину чистой и актуальной для покупателей в зависимости от того, откуда они просматривают магазин. Примечание: Даже когда панель скрыта, логика вознаграждений продолжает работать в фоновом режиме. Например, бесплатный подарок всё равно может быть добавлен в корзину при выполнении условий, даже если панель не видна.

Шаг 1. Найдите коды целевых стран

Вам нужно определить, в каких странах должна отображаться панель вознаграждений. Чтобы найти коды, обратитесь к списку двухбуквенных ISO-кодов стран Shopify. Примеры:

US → США
CA → Канада
MX → Мексика

Шаг 2. Добавьте пользовательский HTML

Перейдите в Upcart > Cart Editor > Settings > Custom HTML
Вставьте следующий код в обе эти области:
- Above announcements/rewards
- On empty cart

Замените "US" на нужный вам код страны (или коды).

<script>  
  function hideRewards() {  
    let rewardsBar = window.upcartDocumentOrShadowRoot.querySelector(".upcart-rewards");  
    let country = window.Shopify.country;  
  
    if (country.includes("US")) {  
      rewardsBar.classList.remove("hide");  
      return;  
    }  
  
    rewardsBar.classList.add("hide");  
  }  
  
  window.upcartSubscribeCartOpened(() => setTimeout(hideRewards, 300));  
  window.upcartSubscribeCartLoaded(hideRewards);  
</script>

Примечание об устаревшем API: обратные вызовы window.upcartOnCartOpened и window.upcartOnCartLoaded всё ещё работают, но считаются устаревшими и выводят предупреждения в консоль. Используйте upcartSubscribeCartOpened и upcartSubscribeCartLoaded для всех новых скриптов.

Альтернативный код для версии Rewards V2.0

Если вы обновили вознаграждения до версии V2, код лишь немного отличается: селектор вознаграждений заменяется новым селектором .upcart-public-rewards. Используйте приведённый ниже код, если вы обновили модуль многоуровневых вознаграждений

<script>  
  function hideRewards() {  
    let rewardsBar = window.upcartDocumentOrShadowRoot.querySelector(".upcart-public-rewards");  
    let country = window.Shopify.country;  
  
    if (country.includes("US")) {  
      rewardsBar.classList.remove("hide");  
      return;  
    }  
  
    rewardsBar.classList.add("hide");  
  }  
  
  window.upcartSubscribeCartOpened(() => setTimeout(hideRewards, 300));  
  window.upcartSubscribeCartLoaded(hideRewards);  
</script>

Чтобы поддерживать несколько стран, измените условие следующим образом:

if (["US", "CA", "GB"].includes(country)) {

Шаг 3. Добавьте пользовательский CSS

Перейдите в Upcart > Cart Editor > Settings > Custom CSS
Вставьте этот код для управления видимостью:

.hide {  
  display: none;   
}

Итоговый результат

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

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

Нужна помощь?

Для сложной региональной логики или поддержки JavaScript мы рекомендуем обратиться к эксперту Shopify. Поддержка Upcart не помогает с написанием или отладкой пользовательского кода. Найти экспертов Shopify

Начало работы

Модули корзины

Настройки корзины

Закреплённая кнопка корзины

Multicart

Кастомизации

Аналитика

Интеграции и совместимость

Оплата и аккаунт

Устранение неполадок

Скрытие панели вознаграждений для определённых стран

Обзор

Шаг 1. Найдите коды целевых стран

Шаг 2. Добавьте пользовательский HTML

Альтернативный код для версии Rewards V2.0

Шаг 3. Добавьте пользовательский CSS

Итоговый результат

Нужна помощь?

​Обзор

​Шаг 1. Найдите коды целевых стран

​Шаг 2. Добавьте пользовательский HTML

​Альтернативный код для версии Rewards V2.0

​Шаг 3. Добавьте пользовательский CSS

​Итоговый результат

​Нужна помощь?

Обзор

Шаг 1. Найдите коды целевых стран

Шаг 2. Добавьте пользовательский HTML

Альтернативный код для версии Rewards V2.0

Шаг 3. Добавьте пользовательский CSS

Итоговый результат

Нужна помощь?