GTMでの実装方法について
Google タグ マネージャー(GTM)を利用して、DLPOタグを設置する方法を説明します。
はじめに
【以下ご一読の上、必要に応じてご利用ください ※設置は必須ではありません】
GTM経由でDLPOタグをご利用いただく場合、対象ページの表示時に一瞬デフォルトHTMLが表示される「フラッシング現象」が発生することがあります。
※この挙動は、各タグマネージャーの仕様によるものであり、現時点では回避策がございません。
以下のスニペットを利用することで、DLPOによる書き換えが完了するまでページ表示を行わず、デフォルトHTMLが一時的に表示される現象のみを回避できます(その間、画面は白くなります)。
※本手法は表示速度を改善するものではなく、表示タイミングは従来通りで、デフォルトHTMLの非表示に限定された処理です。
また、Safari 17以降に導入された「高度なトラッキングとフィンガープリントの保護」機能により、GTMタグがブロックされ、クリエイティブの配信や計測が行えないケースが確認されています。
2025年7月時点では、Safariの「プライベートブラウズ」ではこの保護機能がデフォルトで有効となっており、プライベートブラウズを利用しているユーザーにはDLPOキャンペーンが正常に表示・動作しない可能性があります。
なお、DLPOタグをページに直接設置している場合は、Safariのこの設定による影響は受けません。
■フラッシング対応方法
GTMに設定するDLPOタグとは別に、以下コードを対象ページ<head></head>内のできるだけ上部に設置してください。
<style>.adlpo-async-hide { opacity: 0 !important }</style>
<script>!function(a,b,c,d,e){b.className+=' '+c;e=function(){b.className=b.className.replace(RegExp(' ?'+c),'')};a[c]=e;setTimeout(function(){e();a[c]=null},d);}(window,document.documentElement,'adlpo-async-hide',3000);</script>
設定手順
GTMでは、使用するコンテナに対して「カスタムHTMLタグ」の機能を利用しDLPOタグを設置します。
1.Googleタグマネージャーにログイン後、下記赤枠「新しいタグ」をクリックします。
2.続いて、下記画面から赤枠部分「タグの設定」をクリックします。
3.タグの種類から「カスタムHTML」をクリックします。
4.赤枠部分のテキストエリアにDLPO管理画面で作成した「非同期タグ」を貼り付けます。※非同期タグの「***」はアカウントID及びユーザーIDが入ります。
5.「トリガー」をクリックし、タグ配信するページを設定していきます。ここでは特定のページに配信する設定方法についてご案内します。トリガーの選択にて右上の「+」マークをクリックします。(全てのページに配信する場合はAll Pagesを選択)
6.トリガーの種類は「ページビュー」をクリックし、このトリガーの発生場所にて、タグの配信条件を入力します。
7.トリガー名を入力し、「保存」ボタンをクリックします。
8.タグ名を入力し、「保存」ボタンをクリックします。
9.「公開」ボタンをクリックし、タグ情報を公開します。
以上がGoogleタグマネージャーを利用した非同期タグの設置方法になります。
※タグを配信するタイミングなど、GTM側の設定につきましては別途GTMのヘルプなどをご覧頂きますようお願い致します。
注意事項
- DLPOタグを対象のページで設置したら必ず対象ページをブラウザ等で一度読み込んでください。
(対象ページを一度読み込む事でDLPO管理画面上でタグが認識されます。) - DLPOタグを対象ページに設置してからDLPO管理画面で認識するまでに時間がかかる場合があります。
- GTMを使ったDLPOタグ設定をする場合、非同期タグを利用するようにしてください。(GTMご利用時に同期タグを使用しますと、DLPOが正しく動作致しません。)