概述

如果你只在某些地区提供奖励，可以结合使用 JavaScript 和 CSS，向特定国家/地区的顾客隐藏奖励进度条。这有助于根据购物者的浏览地点，让购物车保持简洁和相关性。 注意： 即使被隐藏，奖励逻辑仍会在后台运行。例如，即使进度条不可见，只要满足条件，免费礼品仍可能被添加到购物车。

第 1 步：查找目标国家/地区代码

你需要定义哪些国家/地区应看到奖励进度条。要查找代码，请参考 Shopify 的 ISO 两位字母国家代码列表。 示例：

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>

旧版说明： 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

最终效果

需要帮助？