次の方法で共有


Microsoft キュレーション - ユニバーサル ピクセルの動的同意更新プログラム

次の手順とコード スニペットは、JavaScript 関数や onclick トリガーなどのイベント リスナーを使用して、ユーザーの操作に基づいて同意状態を動的に更新する方法を示しています。

これを実現する唯一の方法ではなく、特定のセットアップには別の方法が必要な場合があることに注意してください。

重要

この方法では、ユニバーサル ピクセルが同意がない場合にイベントを測定できなくなる可能性があります。 ユニバーサル ピクセルは、同意なしに個人データを使用しないように、該当する同意設定を持つページに読み込むことができます。

詳細については、「 例 3 」を参照してください。

Google の同意モード機能をサポートする同意管理プラットフォーム (CMP) を使用する場合は、ユーザーが特定の目的で同意を与えた場合にのみ、Microsoft のユニバーサル ピクセルを起動することを選択できます。

  1. [タグ>新しい] に移動します。

  2. [ タグの構成] を選択します

  3. [ カスタム HTML] を選択します

  4. 次の JavaScript コードをコピーして貼り付け、 REPLACE_WITH_UP_PIXEL_ID をタグ ID に置き換えます。

    
    <script>
    !function(e,i){if(!e.pixie){var n=e.pixie=function(e,i,a){n.actionQueue.push({action:e,actionValue:i,params:a})};n.actionQueue=[];var a=i.createElement("script");a.async=!0,a.src="//acdn.adnxs.com/dmp/up/pixie.js";var t=i.getElementsByTagName("head")[0];t.insertBefore(a,t.firstChild)}}(window,document);
    pixie('consent', 'default', { 'ad_storage': 'granted' });
    pixie('init', 'REPLACE_WITH_UP_PIXEL_ID');
    pixie('event', 'PageView');
    
    </script>
    <noscript><img width="1" height="1" style="display:none;" src="https://ib.adnxs.com/pixie?pi=REPLACE_WITH_UP_PIXEL_ID&e=PageView&script=0&consent=1" /></noscript>
    
    
  5. [ トリガー] を 選択し、[ すべてのページ] を選択します。

  6. テンプレートを保存します。

  1. GTM の [タグ] に移動し、作成したタグを選択します。
  2. [ タグの構成] を 選択し、既存のタグを編集します。
  3. [ 詳細設定] を展開します
  4. [ 同意設定] セクションを展開します。
  5. [ タグの起動に追加の同意が必要] を選択します
  6. ad_storageなど、必要な目的を選択します。
  7. 変更内容を保存します。

ユニバーサル イベント トラッカーの同意設定を説明するスクリーンショット。

注:

この設定により、ユニバーサル ピクセルは、ユーザーが CMP プロバイダー経由で ad_storage に同意した場合にのみイベントを測定します。

テストとデバッグ

  • GTM のプレビュー モード: GTM のプレビュー モードを使用して、トリガーとタグをテストします。
  • ブラウザー コンソールを確認します。 ブラウザー コンソールを開き、同意の更新プログラムが正しくプッシュされていることを確認します。

これらの手順に従うことで、ユーザーの操作に基づいて同意設定を動的に更新し、コンプライアンスとわかりやすいエクスペリエンスを確保できます。

GTM でユーザー操作トリガーを作成する

ユーザーが同意バナーを操作するときに発生するトリガーを GTM で作成する必要があります (たとえば、[はい] または [いいえ] をクリックします)。

[はい] のトリガーをクリックします

  1. GTM の [トリガー] に移動し、新しいトリガーを作成します。
  2. [ クリック - すべての要素] を選択します
  3. [ クリック数] を選択します
  4. [ 変数 Built-In 選択 ] を選択し 、[クリック ID] を選択します
  5. 同意プロンプト ボタン ID を使用して条件を定義します。
  6. トリガーに名前を付けます (例: Consent Granted Click)。

[いいえ] のトリガーをクリックします

[ いいえ ] ボタンに上記の手順を繰り返し、 Consent Denied Clickという名前を付ける。

<div id="consent-banner">  
  <p>We use cookies to improve your experience. Do you accept?</p>  
  <button id="consent-yes">Yes</button>  
  <button id="consent-no">No</button>  
</div>  

同意が付与されたトリガーの例を示すスクリーンショット。

  1. [タグ>新しい] に移動します。

  2. [ カスタム HTML タグ] を選択します

  3. 次のスクリプトを追加します。

    <script>
    pixie ('consent', 'update', { 'ad_storage': 'granted' });
    </script>
    
    
  4. [トリガー] を [Consent Granted Click] に設定します。

  5. タグを保存して発行します。

  1. 上記の手順を繰り返しますが、次のスクリプトを使用します。

    <script>
    pixie ('consent', 'update', { 'ad_storage': 'denied' });
    </script>
    
  2. [トリガー] を [Consent Denied Click] に設定します。

  3. タグを保存して発行します。

同意バナー HTML に、GTM トリガーの要素を識別するために使用できる ID またはクラスを含むボタンが含まれていることを確認します。

GTM のデータ レイヤーにユーザーの選択に関するカスタム イベントを送信する

ページが既にユーザーのプライバシーの選択をリッスンし、JavaScript を制御している場合は、GTM ワークスペースのカスタム イベント トリガーとして GTM のデータ レイヤーに送信されるカスタム イベントを使用できます。

<div id="consent-banner">  
  <p>We use cookies to improve your experience. Do you accept?</p>  
  <button id="consent-yes">Yes</button>  
  <button id="consent-no">No</button>  
</div>  

同意バナーが上記の例と一致する場合は、次のようにカスタム GTM イベントを GTM のデータ レイヤーに送信できます。

jQuery の使用:

$('#consent-yes').click(function() {
    dataLayer.push({'event': 'consent_granted'});
});

JavaScript の使用:

document.getElementById('consent-yes').addEventListener('click', function() {
    dataLayer.push({'event': 'consent_granted'});
});

GTM でユーザー操作トリガーを作成する

同意バナーを使用してユーザーの操作を追跡するには、ユーザーが [はい ] または [いいえ] をクリックしたときに発生するトリガーを GTM に作成します。

"はい" のクリック トリガーを作成する

  1. GTM で、[ トリガー] に移動し、新しいトリガーを作成します。
  2. [ カスタム イベント] を選択します
  3. わかりやすいイベント名を入力します。
  4. [ いくつかのカスタム イベント] を選択します
  5. 変数型として Event を設定します。
  6. 条件演算子を選択し、カスタム JavaScript 関数から データ レイヤー イベント名 を入力します。
  7. トリガーに名前を付けます (たとえば、 同意が付与されたクリック)。

"いいえ" のクリック トリガーを作成する

[ いいえ ] ボタン (またはそれと同等のもの) に対して上記の手順を繰り返し、トリガーに名前を付けます ([ 同意拒否] クリックなど)。

GTM で 2 つのカスタム HTML タグを作成し、ユーザーの操作に基づいて同意の状態を更新します。

  1. GTM で、[ タグ ] に移動し、新しいタグを作成します。

  2. [ カスタム HTML タグ] を選択します

  3. 次のスクリプトを追加します。

    <script> 
    pixie('consent', 'update', { 'ad_storage': 'granted' });
    
    
  1. [トリガー] を、先ほど作成した "同意付与されたクリック" トリガーに設定します。
  2. タグを保存して発行します。
<script>
pixie ('consent', 'update', { 'ad_storage': 'denied' });
</script>

例 2 と同じ手順に従って、Consent Granted ClickConsent Denied Clickのカスタム HTML タグを作成します。

これらの方法を実装することで、GTM を通じてユーザーの同意設定に動的に準拠できます。