メインコンテンツへスキップ
このガイドでは、Google Tag Manager（GTM）を使用してOneSignalをWebサイトに統合する方法を説明します。OneSignal Service Workerのセットアップ、更新された初期化コード、およびユーザープロファイルタグ（属性）をOneSignalに送信する新しいステップを紹介します。

​
OneSignalアプリをセットアップする

Webプッシュセットアップドキュメントに従ってください。プロンプトが表示されたら、App IDをメモしてください。以下のコードでこれを置き換えます。

​
OneSignal初期化コードをコピーして更新する

Add Code to Siteステップに到達したら、Copy Codeをクリックします。

OneSignalダッシュボードで提供されるコードをコピーします。

以下に示すように、Google Tag Managerで動作するようにコードをいくつか調整する必要があります： 
<script src="https://cdn.onesignal.com/sdks/web/v16/OneSignalSDK.page.js" defer></script>
<script>
  window.OneSignalDeferred = window.OneSignalDeferred || [];
  // remove async
  OneSignalDeferred.push( function(OneSignal) {
    // remove await
    OneSignal.init({
      // replace with YOUR_APP_ID
      appId: "YOUR_APP_ID",
    })
    // Add event to track OneSignal initialization if desired
      .then(function() {
        dataLayer.push({ event: 'OneSignalInitialized' });
      }).catch(function(e) {
        console.error("OneSignal initialization failed:", e);
    });
  });
</script>

​
Google Tag Managerをセットアップする

Google Tag Managerアカウントにログインし、OneSignal Initという新しいタグをセットアップします。 Tag Configuration/Tag TypeはCustom HTMLにする必要があります。 OneSignalコードをHTMLフィールドに貼り付けます。 Advanced Settings > Tag firing optionsの下で、Once per pageを選択します。
Triggeringには、Initialization - All Pagesを選択します。
右上のSaveをクリックしてタグを保存します。 Workspaceに戻り、PublishまたはSubmitをクリックして変更をデプロイできます。 OneSignalをロードしたいサイトのすべてのページにコンテナがインストールされており、初期化タグが期待どおりに発火していることを確認してください。
追加のセットアップサポートが必要な場合は、Google Tag Manager Helpを参照してください。

​
テスト

Webサイトにアクセスすると、セットアップしたプロンプト設定に基づいてプッシュ通知のサブスクライブを促されます。詳細については、Webパーミッションプロンプトを参照してください。 OneSignalダッシュボードのAudience > Subscriptionsをチェックして、Subscriptionsを確認します。サブスクリプションを見つけて、Test subscriptionsとして設定します。 次に、Messages > New Pushに移動して、自分自身に通知を送信します。
問題が発生した場合は、一般的な修正についてWebプッシュトラブルシューティングガイドをチェックしてください。
次のステップについてはWebプッシュチュートリアルをご覧いただくか、他のGTMオプションについては以下を続けてください。

​
データタグを追加する

このステップでは、OneSignal.User.addTagsメソッドを使用して、GTMからOneSignalにカスタムユーザーデータタグ（属性）を送信します。 次のコードスニペットを使用してタグを設定します。"TAG_1"と"VALUE_1"を目的のタグキーと値に置き換えます： 
<script>
window.OneSignalDeferred = window.OneSignalDeferred || [];
OneSignalDeferred.push(function(OneSignal) {
  OneSignal.User.addTags({
      "TAG_1": "VALUE_1"
  });
});
</script>
タグが適切な条件下で発火するようにするには、次を組み合わせたトリガーグループを構成します：
  • Trigger 1：イベントOneSignalInitializedで発火するカスタムイベントトリガー（OneSignalが初期化されていることを確認）。
  • Trigger 2：使用したい追加のトリガー（たとえば、ページビューまたはカスタムユーザーイベント）。
トリガーグループを作成するには：
  1. GTM Workspaceで、Triggersに移動し、Newをクリックします。
  2. トリガータイプとしてTrigger Groupを選択します。
  3. トリガーグループに名前を付けます（例：「OS Tag – Initialized & Custom Trigger」）。
  4. Configure Trigger Groupの下に、次のトリガーを追加します：
    1. Custom Event Trigger：
      1. トリガータイプとしてCustom Eventを選択します。
      2. イベント名をOneSignalInitializedに設定します。
    2. Additional Trigger：
      1. 基準を満たすトリガーを選択します（例：All Pages、またはユーザーログイン後などのカスタムトリガー）。
  5. Trigger Groupを保存します。
  1. GTM Workspaceで、New Tagをクリックします。
  2. Tag ConfigurationをCustom HTMLに設定し、ステップ5.1のコードスニペットを貼り付けます。
  3. Advanced Settings > Tag firing optionsの下で、Once per pageを選択します（またはニーズに基づいて調整します）。
  4. Triggeringには、ステップ5.2で作成したTrigger Groupを選択します。
  5. タグを保存します。

​
変更を公開する

新しいタグとそのトリガーグループを構成した後、コンテナを公開して新しいユーザータギング機能をデプロイします。

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

GTMのPreviewとDebug Modeを使用して、初期化タグとユーザープロファイルタギングタグの両方が正しく発火することを確認します。 ブラウザコンソールでOneSignal関連のエラーをチェックし、OneSignalダッシュボードでエラー通知を確認します。 DataLayer Events：イベント（例：OneSignalInitialized）が、分析セットアップでの追跡のために期待どおりにdataLayerにプッシュされることを確認します。 詳細については、Web SDKトラブルシューティングを参照してください。
これらの更新により、WebサイトはOneSignalの最新の初期化を使用し、OneSignal.User.addTagsメソッドを使用してGTM経由でカスタムユーザープロファイルタグを送信するようになりました。追加されたトリガーグループにより、OneSignalが初期化された後、かつ選択した条件が満たされた場合にのみタグが発火することが保証されます。
追加のカスタマイズや高度な追跡については、Web SDKリファレンスとGoogle Tag Managerドキュメントを参照してください。 質問がある場合や問題が発生した場合は、Web SDKトラブルシューティングを参照するか、OneSignalサポートにお問い合わせください。