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

# Shopify

> Vendo統合を通じてShopifyをOneSignalに接続し、Webプッシュ通知、顧客タグ、コマースイベント、行動ターゲティングを実現します。

OneSignalはVendoと提携し、シームレスなShopify統合を実現しました。Vendoはワンクリックでお客様のShopifyストアフロントにOneSignal SDKを展開します — テーマコードの手動編集は不要です。顧客タグ、クライアントサイドの閲覧イベント、サーバーサイドのコマースイベントをOneSignalに同期し、実際の行動と購買履歴からセグメントを構築してプッシュキャンペーンをトリガーできます。

Vendoのドキュメントについては、[Vendo OneSignal Destination](https://docs.vendodata.com/destinations/onesignal/overview)をご覧ください。

## 前提条件

始める前に、以下が揃っていることを確認してください：

* [Vendoアプリ](https://apps.shopify.com/)がインストールされたShopifyストア
* OneSignalアカウントとアプリ（Webプラットフォーム）
* OneSignalの**App ID**（必須）
* OneSignalの**REST API Key**（注文同期やユーザータグ付けなどのサーバーサイドイベントに必要）

## OneSignalの設定

<Steps>
  <Step title="OneSignalアプリを作成する">
    [onesignal.com](https://onesignal.com)にログインし、アプリを作成または選択します。プラットフォームとして**Web**を選択し、統合タイプとして**Custom Code**を選択します。
  </Step>

  <Step title="Webプッシュ設定を構成する">
    OneSignalアプリで、**Settings > Push & In-App > Web Settings**に移動するか、[Webプッシュ設定](./web-push-setup)ガイドに従ってください。

    **サイト設定**

    * **Site Name**：ストア名。デフォルトの通知タイトルとして使用されます。
    * **Site URL**：Shopifyストアの公開アクセス可能なURL（例：`https://yourstore.com`）。
      * サイトの正確な[オリジン](https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy)である必要があります。
      * 顧客が`https://your-site.com/`のようなカスタムドメインからサイトにアクセスする場合は、`https://your-site.myshopify.com/`を使用しないでください。
    * **Default Icon URL**：通知プロンプトとメッセージ用の256x256pxの正方形PNG またはJPG画像をアップロードします。設定されていない場合はベルアイコンが使用されます。
  </Step>

  <Step title="Service Workerパスを設定する">
    Shopifyはサイトのルートからファイルを配信できないため、VendoがService Workerファイルを配信する場所をOneSignalに伝える必要があります。

    OneSignalで、**Settings > Push & In-App > Web Settings**に移動し、**Advanced Push Settings**までスクロールして次のように設定します：

    | 設定                                | 値                       |
    | --------------------------------- | ----------------------- |
    | Service Worker Path               | `/apps/vendo/`          |
    | Service Worker Filename           | `OneSignalSDKWorker.js` |
    | Updater Filename                  | `OneSignalSDKWorker.js` |
    | Service Worker Registration Scope | `/apps/vendo/`          |

    <Frame caption="Vendoを使用するShopifyストアのService Worker設定。">
      <img src="https://mintcdn.com/onesignal/N_-d1DtCTRgGPN4l/images/integrations/shopify/vendo-service-worker-configuration.png?fit=max&auto=format&n=N_-d1DtCTRgGPN4l&q=85&s=b7bc1794445e002bd3427c94a6ec6ccf" alt="OneSignal Advanced Push Settings showing service worker paths configured for Vendo" width="3038" height="1108" data-path="images/integrations/shopify/vendo-service-worker-configuration.png" />
    </Frame>

    Vendoは`https://yourstore.myshopify.com/apps/vendo/OneSignalSDKWorker.js`に必要な`OneSignalSDKWorker.js`ファイルを自動的に配信します — 手動でのファイルアップロードは不要です。

    <Note>
      Updater FilenameとService Worker Filenameは同じファイルです。OneSignal v16+は両方の目的に単一のService Workerを使用します。
    </Note>
  </Step>

  <Step title="認証情報をコピーする">
    OneSignalで、[**Settings > Keys & IDs**](./keys-and-ids)に移動し、**App ID**と**REST API Key**をコピーします。これらをVendoに入力します。
  </Step>
</Steps>

## Vendoの設定

<Steps>
  <Step title="Vendoアプリをインストールする">
    Shopify App StoreからVendoアプリをインストールします。
  </Step>

  <Step title="OneSignal統合を追加する">
    Vendoで、**Integrations > Add Integration > OneSignal**（または**Destinations > OneSignal**）に移動します。

    <Frame caption="VendoにOneSignal統合を追加する。">
      <img src="https://mintcdn.com/onesignal/PoskQI_qr0DD8jDV/images/integrations/shopify/vendo-onesignal-integrations.png?fit=max&auto=format&n=PoskQI_qr0DD8jDV&q=85&s=13acfaf4e6b01f77535f1a1386c4212d" alt="Vendo Integrations page showing the OneSignal integration option" width="2520" height="1756" data-path="images/integrations/shopify/vendo-onesignal-integrations.png" />
    </Frame>
  </Step>

  <Step title="OneSignalの認証情報を入力する">
    前のセクションのOneSignalの**App ID**と**REST API Key**を入力し、**Save**をクリックします。
  </Step>

  <Step title="Vendoテーマブロックを有効にする">
    VendoテーマブロックはストアフロントにOneSignal SDKを読み込みます。これがないとプッシュプロンプトが表示されず、クライアントサイドのトラッキングも機能しません。

    1. Shopify管理者で、**Online Store > Themes > Customize**に移動します。
    2. **App embeds**（左サイドバーのパズルピースアイコン）をクリックします。
    3. **Vendo**をオンにします。
    4. **Save**をクリックします。

    テーマブロックはSDKの初期化、Service Workerの登録、プッシュプロンプトの表示、ユーザー識別（プッシュ購読、ログイン、ニュースレター登録）、タグ同期を処理します。
  </Step>

  <Step title="同期するイベントを選択する">
    Vendoアプリの**OneSignal > Events**で、OneSignalに送信したいクライアントサイドとサーバーサイドのイベントを有効にします。イベントの完全なリストについては、以下の[トラッキング](#tracking)をご覧ください。
  </Step>

  <Step title="履歴データの同期（オプション）">
    Vendoは既存の顧客と最近の注文履歴をOneSignalにバックフィルできます。これは認証情報を保存した後、バックグラウンドで自動的に行われます。

    <Frame caption="Vendoの履歴データ同期オプション。">
      <img src="https://mintcdn.com/onesignal/dknFSNQuQfw5IM0j/images/integrations/shopify/vendo-historical-data.png?fit=max&auto=format&n=dknFSNQuQfw5IM0j&q=85&s=4eb61a384a7ac3f4596661348f98ac48" alt="Vendo historical data settings showing sync options for Shopify data" width="1724" height="762" data-path="images/integrations/shopify/vendo-historical-data.png" />
    </Frame>
  </Step>
</Steps>

## トラッキング

### ユーザー識別

Vendoは**識別済みユーザーのみ**のアプローチを使用します — 匿名の訪問者はOneSignalでトラッキングされません。イベントが送信される前に、ユーザーは4つの方法のいずれかで識別される必要があります。これにより重複ユーザーを防ぎ、クリーンで実用的なデータを確保します。

| 方法            | 仕組み                                                                            | 使用される識別子                     |
| ------------- | ------------------------------------------------------------------------------ | ---------------------------- |
| **Webプッシュ購読** | 訪問者がプッシュプロンプトで「許可」をクリックします。OneSignalが自動的にユーザーを作成し、VendoがOneSignal IDをキャプチャします。 | OneSignal ID                 |
| **ニュースレター登録** | 訪問者がニュースレターまたはメールフォームを送信します。Vendoがメールをキャプチャし、`OneSignal.login(email)`を呼び出します。  | Email                        |
| **顧客ログイン**    | 顧客がShopifyアカウントにログインします。Vendoがこれを検出し、設定された識別子で`OneSignal.login()`を呼び出します。      | Shopify Customer ID またはEmail |
| **購入完了**      | 顧客が購入を完了します。Vendoが識別子を保存し、`OneSignal.login()`を呼び出します。                          | Shopify Customer ID またはEmail |

<Warning>
  モバイルアプリやサードパーティの接続がある場合は、ユーザープロファイルをプラットフォーム間で一貫させるために、他のツールと一致する識別子（Shopify Customer ID vs. Email）を選択してください。Vendoアプリの**Settings > Customer Identifier**で設定します。
</Warning>

#### アイデンティティのマージ

プッシュ購読者（OneSignal IDで識別）が後でログインしたり購入を完了した場合、VendoはそのShopify Customer IDまたはメールで`OneSignal.login()`を呼び出します。OneSignalはプッシュ購読を識別済みユーザーにリンクします — 重複ユーザーは作成されません。過去のすべてのプッシュ購読が保持され、サーバーサイドイベント（注文、履行）が正しいユーザープロファイルに届きます。

### 顧客タグ

Vendoはセグメンテーションのために顧客プロパティをOneSignalの[タグ](./add-user-data-tags)として同期します。すべての値は文字列として保存されます（OneSignalのネイティブフォーマット）。

| タグ                        | 説明                     |
| ------------------------- | ---------------------- |
| `email`                   | 顧客のメールアドレス             |
| `first_name`              | 名                      |
| `last_name`               | 姓                      |
| `total_spent`             | 生涯購入金額                 |
| `order_count`             | 総注文数                   |
| `verified_email`          | `"true"` または `"false"` |
| `tax_exempt`              | `"true"` または `"false"` |
| `marketing_state`         | マーケティング同意状態            |
| `first_order_date`        | 初回注文日（ISO 8601）        |
| `last_order_date`         | 最新注文日（ISO 8601）        |
| `customer_created_at`     | 顧客作成日                  |
| `customer_tags`           | カンマ区切りのShopifyタグ       |
| `email_marketing_consent` | マーケティングオプトイン状態         |

### クライアントサイドイベント

VendoはShopify Web Pixelを通じてストアフロントのクライアントサイド[カスタムイベント](./custom-events)をトラッキングし、OneSignalに送信します。これらのイベントはユーザーが識別された後にのみ送信されます。

| イベント                               | 説明                                 |
| ---------------------------------- | ---------------------------------- |
| `page_viewed`                      | 顧客がページを訪問（ストアフロント、チェックアウト、または注文状態） |
| `product_viewed`                   | 顧客が商品詳細ページを表示                      |
| `collection_viewed`                | 顧客が商品コレクションページを表示                  |
| `search_submitted`                 | 顧客がストアフロントで検索を実行                   |
| `product_added_to_cart`            | 商品がカートに追加された                       |
| `product_removed_from_cart`        | 商品がカートから削除された                      |
| `cart_viewed`                      | 顧客がカートページを表示                       |
| `checkout_started`                 | 顧客がチェックアウトを開始                      |
| `checkout_contact_info_submitted`  | 連絡先情報ステップが送信された                    |
| `checkout_address_info_submitted`  | 住所情報ステップが送信された                     |
| `checkout_shipping_info_submitted` | 配送方法が選択された                         |
| `payment_info_submitted`           | 支払い詳細が送信された                        |
| `checkout_completed`               | チェックアウトが正常に完了                      |

<Frame caption="Vendoのクライアントサイドイベント設定。">
  <img src="https://mintcdn.com/onesignal/dknFSNQuQfw5IM0j/images/integrations/shopify/vendo-client-side-events.png?fit=max&auto=format&n=dknFSNQuQfw5IM0j&q=85&s=c94b99465b8c200ebb1bb475e492f8a1" alt="Vendo client-side events settings showing available custom events" width="865" height="726" data-path="images/integrations/shopify/vendo-client-side-events.png" />
</Frame>

### サーバーサイドイベント

ShopifyのコマースイベントはVendoパイプラインを通じてエクスポートされ、OneSignalに転送されます。これらは常にShopify Customer IDを`external_id`として使用します。

| イベント                        | 説明            |
| --------------------------- | ------------- |
| `received_orders`           | 新しい注文が作成された   |
| `fulfilled_orders`          | 注文が履行/発送された   |
| `delivered_orders`          | 注文が配達された      |
| `refunded_orders`           | 注文が全額返金された    |
| `partially_refunded_orders` | 注文が一部返金された    |
| `abandoned_checkouts`       | チェックアウトが放棄された |

<Frame caption="Vendoのサーバーサイドイベント設定。">
  <img src="https://mintcdn.com/onesignal/dknFSNQuQfw5IM0j/images/integrations/shopify/vendo-server-side-events.png?fit=max&auto=format&n=dknFSNQuQfw5IM0j&q=85&s=c9bed30c26b0bec3b8a53eb8cde8098d" alt="Vendo server-side events settings showing available Shopify webhook events" width="865" height="394" data-path="images/integrations/shopify/vendo-server-side-events.png" />
</Frame>

### 共通イベントプロパティ

すべてのイベントには以下のプロパティが含まれます（文字列として）：

| プロパティ              | 説明            |
| ------------------ | ------------- |
| `order_id`         | 表示注文識別子       |
| `shopify_order_id` | Shopify内部注文ID |
| `email`            | 顧客のメールアドレス    |
| `currency`         | 注文通貨          |
| `source`           | イベントソース       |
| `version`          | 統合バージョン       |

### データ同期頻度

| データタイプ | 同期頻度           |
| ------ | -------------- |
| 顧客タグ   | 4〜6時間ごと        |
| 注文イベント | ほぼリアルタイム（数分以内） |
| 放棄カート  | 1〜2時間ごと        |
| 履行イベント | ほぼリアルタイム       |

## プラットフォーム詳細

| 設定        | 値                                         |
| --------- | ----------------------------------------- |
| 同期方法      | Vendo経由のクライアント + サーバーサイド                  |
| アイデンティティ  | Shopify Customer ID、Email、またはOneSignal ID |
| 重複排除      | イベントごとのUUID v5ハッシュ                        |
| バッチサイズ    | リクエストあたり1,000イベント                         |
| データフォーマット | すべての値を文字列として保存                            |

## ユースケース

### 放棄カート回収

`abandoned_checkouts`イベントでトリガーされる[Journey](./journeys-overview)を作成します。放棄から1時間待って、`checkout_url`プロパティを使用した回収リンク付きのプッシュ通知を送信します。

### 注文状態の更新

`fulfilled_orders`と`delivered_orders`のJourneyを作成し、注文が発送・配達された際に追跡情報を含む即時プッシュ通知を送信します。

### VIP顧客のエンゲージメント

`total_spent`がしきい値を超える[セグメント](./segmentation)を作成し、`first_name`タグでパーソナライズされた限定オファーを送信します。

### 再エンゲージメントキャンペーン

`last_order_date`が90日以上前のセグメントを作成して非アクティブな顧客をターゲットにし、ウィンバックキャンペーンを送信します。

## 対応ソース

OneSignalは以下のVendoデータソースに対応しています：

| ソース       | イベント | ユーザータグ | オーディエンス |
| --------- | ---- | ------ | ------- |
| Shopify   | あり   | あり     | あり      |
| Stripe    | あり   | あり     | あり      |
| Mixpanel  | —    | —      | あり      |
| Segment   | —    | —      | あり      |
| Amplitude | —    | —      | あり      |

イベントとユーザータグにはShopifyまたはStripeをデータソースとして使用する必要があります。オーディエンスセグメントはBigQueryデータセット内の任意のソースデータから構築できます。

***

## テスト

<Steps>
  <Step title="Service Workerを確認する">
    ブラウザーで`https://yourstore.myshopify.com/apps/vendo/OneSignalSDKWorker.js`にアクセスします。JavaScriptコードが表示されるはずです。404が表示された場合は、Vendoアプリがインストールされているか確認してください。

    ブラウザーのDevTools（**F12**）を開き、**Application > Service Workers**に移動して、`OneSignalSDKWorker.js`がスコープ`/apps/vendo/`で登録されていることを確認することもできます。
  </Step>

  <Step title="プッシュプロンプトをテストする">
    シークレット/プライベートウィンドウでストアフロントを開きます。OneSignalの通知許可プロンプトが表示されるはずです。**許可**をクリックして購読します。
  </Step>

  <Step title="テスト通知を送信する">
    OneSignalダッシュボードで、**Messages > Push > New Message**に移動します。購読者にテスト通知を送信し、表示されることを確認します。
  </Step>

  <Step title="OneSignalでユーザーデータを確認する">
    **Audience > Subscriptions**に移動し、テスト購読が表示されていることを確認します。識別済みユーザーのユーザータグ（メール、名前など）が同期されているか確認します。
  </Step>

  <Step title="テストイベントをトリガーする">
    ストアで商品を閲覧するか、テストチェックアウトを完了します。OneSignalダッシュボードのユーザーアクティビティにイベントが表示されることを確認します。
  </Step>
</Steps>

***

## トラブルシューティング

### Service Workerが404を返す

Service Workerは`/apps/vendo/OneSignalSDKWorker.js`に存在する必要があります。ルートパス（`/OneSignalSDKWorker.js`）で404エラーが表示される場合、Service WorkerパスがOneSignalに設定されていません — [Service Worker設定ステップ](#configure-the-service-worker-path)に従ってください。`/apps/vendo/`パスで404が表示される場合は、Vendoアプリがインストールされておりテーマブロックが有効になっていることを確認してください。

### プッシュプロンプトが表示されない

**App embeds**でVendoテーマブロックが有効になっているか確認してください。ブラウザーが通知を許可しているか確認してください（アドレスバーの錠前アイコンをクリック）。以前にプロンプトが拒否されていた場合に備えて、シークレット/プライベートウィンドウを試してください。

### タグがOneSignalに表示されない

タグは識別済みユーザーにのみ同期されます — 匿名の訪問者はトラッキングされません。ユーザーがプッシュ購読、ログイン、ニュースレター登録、またはチェックアウトで識別されていることを確認してください。初期タグ同期には数時間かかる場合があります。

### イベントがトリガーされない

Vendoアプリの**OneSignal > Events**でイベントが有効になっていることを確認してください。クライアントサイドイベントにはShopify Web Pixelがアクティブで、ユーザーが識別されている必要があります。サーバーサイドイベントにはREST API Keyが設定されている必要があります。

### 通知は「配信済み」と表示されるが表示されない

統合は正常に機能しています — 問題はブラウザーまたはOSの通知設定にあります。ブラウザーのOSの通知設定を確認し、おやすみモード/集中モードがオフになっていることを確認し、ブラウザーレベルの通知権限を確認してください。

***

## FAQ

### セットアップ後に顧客識別子を変更できますか？

はい。Vendoアプリの**Settings > Customer Identifier**で設定を更新します。既存のユーザーがすでに以前の方法で識別されていた場合、識別子を変更すると別々のユーザープロファイルが作成される可能性があります。

### Vendo統合はモバイルアプリをサポートしますか？

Vendo統合はShopifyストアフロントとWebプッシュに特化しています。モバイルアプリも持っている場合は、ユーザープロファイルを一貫させるために、Vendoで選択する識別子がモバイルアプリで使用するものと一致することを確認してください。

### 訪問者が識別されなかった場合はどうなりますか？

識別されていない訪問者のイベントはOneSignalに送信されません。訪問者が自己を識別すると（プッシュ購読、ログイン、ニュースレター登録、またはチェックアウト完了）、Vendoはイベントの送信を開始します。この識別済みユーザーのみのアプローチにより、重複ユーザーを防ぎ、クリーンなデータを確保します。

### VendoはなぜIdentified-Onlyアプローチを使用するのですか？

以前のバージョンはShopifyのセッションクッキーを識別子として使用して匿名訪問者をトラッキングしていました。これにより適切にマージできない重複OneSignalユーザーが作成され、ユーザー数の水増しとデータの断片化につながりました。Identified-Onlyアプローチにより、すべてのOneSignalユーザーが実在し、実用的であることを保証します。

***

## 関連ページ

<Columns cols={2}>
  <Card title="Keys & IDs" icon="key" href="./keys-and-ids">
    OneSignalのApp IDとREST APIキーを確認します。
  </Card>

  <Card title="カスタムイベント" icon="bolt" href="./custom-events">
    ユーザー行動をトラッキングし、Shopifyイベントに基づいて自動化をトリガーします。
  </Card>

  <Card title="Webプッシュ設定" icon="globe" href="./web-push-setup">
    ShopifyストアのWebプッシュ通知を設定します。
  </Card>

  <Card title="Web権限プロンプト" icon="bell" href="./permission-requests">
    訪問者にWebプッシュ許可を求める方法とタイミングを設定します。
  </Card>
</Columns>