> ## Documentation Index
> Fetch the complete documentation index at: https://docs.aftersell.com/llms.txt
> Use this file to discover all available pages before exploring further.

# 为特定国家/地区隐藏奖励进度条

> 使用自定义 HTML 和 CSS，根据顾客所在位置显示或隐藏奖励进度条。

<div id="overview">
  # 概述
</div>

如果你只在某些地区提供奖励，可以结合使用 JavaScript 和 CSS，向特定国家/地区的顾客隐藏奖励进度条。这有助于根据购物者的浏览地点，让购物车保持简洁和相关性。

**注意：**

即使被隐藏，奖励逻辑仍会在后台运行。例如，即使进度条不可见，只要满足条件，免费礼品仍可能被添加到购物车。

***

<div id="step-1-find-your-target-country-codes">
  ## 第 1 步：查找目标国家/地区代码
</div>

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

**示例：**

* `US` → 美国
* `CA` → 加拿大
* `MX` → 墨西哥

***

<div id="step-2-add-custom-html">
  ## 第 2 步：添加自定义 HTML
</div>

1. 前往 **Upcart > Cart Editor > Settings > Custom HTML**
2. 将以下代码**同时**粘贴到以下两个位置：

   * 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>
```

<Note>
  **旧版说明：** `window.upcartOnCartOpened` 和 `window.upcartOnCartLoaded` 回调仍然可用，但已被弃用并会在控制台记录警告。所有新脚本请使用 `upcartSubscribeCartOpened` 和 `upcartSubscribeCartLoaded`。
</Note>

<div id="alternative-code-for-rewards-v20-version">
  ## Rewards V2.0 版本的替代代码
</div>

如果你已将奖励升级到 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)) {
```

***

<div id="step-3-add-custom-css">
  ## 第 3 步：添加自定义 CSS
</div>

1. 前往 **Upcart > Cart Editor > Settings > Custom CSS**
2. 粘贴以下代码来控制可见性：

```
.hide {  
  display: none;   
}
```

***

<div id="final-result">
  ## 最终效果
</div>

被排除国家/地区的顾客在购物车中将看不到奖励进度条，尽管奖励逻辑仍在后台运行。

在以下情况下使用此方法：

* 你只在特定市场提供奖励
* 你想避免显示不适用的促销活动
* 在设置正式的基于地区的逻辑之前，你需要一个短期的变通方案

***

<div id="need-help">
  ## 需要帮助？
</div>

对于高级区域逻辑或 JavaScript 支持，我们建议与 **Shopify 专家**合作。Upcart 支持团队不提供编写或排查自定义代码方面的协助。

[查看 Shopify 专家](https://www.shopify.com/partners/directory)