> ## 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 2 文字国コード**のリストを参照してください。

**例：**

* `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 Expert** との連携をおすすめします。Upcart のサポートは、カスタムコードの作成やトラブルシューティングの支援は行っていません。

[Shopify Experts を見る](https://www.shopify.com/partners/directory)