Google タグマネージャを使ってオプティマイズ タグを配信する

その他の方法です。

ご利用対象

この記事は、Google タグマネージャからオプティマイズのタグを配信したい方を対象としています。

 

  • タグマネージャをご利用でない場合は、こちらの記事をご覧ください。
  • オプティマイズと Google タグマネージャでのおすすめの方法については、こちらの記事をご覧ください。

Google タグマネージャ(GTM)を使って Google アナリティクス(GA)を設定し、GTM のオプティマイズ ネイティブ タグを使用する場合は、以下の手順を行ってください。

この記事の内容:

おすすめの方法は、アナリティクス トラッキング コードに手を加えたものを作成して、ページに直接設定する方法です。この方法では、ページの読み込み時にオプティマイズ コンテナが初期化されるため、タグマネージャを待機することはありません。このため、テストを効率良く実施し、ページの読み込み時間や待ち時間を短縮して、優れたユーザー エクスペリエンスを提供できます。

おすすめの方法に関する詳細をご覧ください。

その他の方法

Google タグマネージャを使ってオプティマイズ プラグインを配信することも可能ですが、そのように設定すると、特に接続速度が遅いウェブサイトや、多数の画像を表示しているか読み込みに時間がかかるウェブサイトでは、待ち時間が長くなる可能性があります。

タグマネージャを使ってオプティマイズ タグを配信する際は、オプティマイズ コンテナを読み込む前に GTM コンテナを読み込む必要があります。このため、タグマネージャ コンテナとオプティマイズ コンテナの両方が読み込まれるまで、テストは実施されません。

このような制限があっても問題がない場合は、以下の手順でタグマネージャを使ってオプティマイズ タグを配信してください。

ステップ 1: 必要な情報を収集する

タグマネージャーでオプティマイズ タグを直接設定するには、次の情報が必要です。

  1. アナリティクス プロパティID - アナリティクスから取得。
  2. オプティマイズ コンテナ ID - オプティマイズから取得。
  3. アナリティクスのカスタム トラッカー設定を使用しているタグマネージャのすべてのアナリティクス タグ。

ステップ 2: タグマネージャでオプティマイズ タグを設定する

上記の情報を取得したら、Google タグマネージャオプティマイズのタグ設定ガイドに沿って以下の設定を行います。

  1. タグ マネージャーにログインして、アカウントを選択します。
  2. [タグ] > [新規] をクリックします。
  3. [タグの設定] > [Google オプティマイズ] をクリックします。
  4. オプティマイズのコンテナ ID を入力します。
  5. Google アナリティクス設定変数を選択します。
  6. [保存] をクリックして、トリガーを設定せずにタグを保存します。
  7. オプティマイズ コンテナにリンクされている、アナリティクス プロパティのアナリティクス ページビュー タグを開きます。
  8. [タグの設定] > [詳細設定] > [タグの順序付け] をクリックします。
  9. このタグが呼び出される前にタグを呼び出すチェックボックスをオンにします。[設定タグ] 見出しでメニューをクリックし、設定するオプティマイズ タグを選択します。
  10. オプティマイズ タグがページごとに 1 回起動するように設定して、保存します。
  11. タグ マネージャーのコンテナを公開し、変更を反映します。

ステップ 3: ページを非表示にするスニペットを追加する

最後に、ページを非表示にするスニペットをウェブページにインストールします。設定しなくてもかまいませんが、ページ フリッカーのリスクを大幅に抑えて、接続速度の遅いユーザーにも快適なエクスペリエンスを提供できます。

The Optimize page-hiding snippet looks like this:

<!-- Page hiding snippet (recommended) -->
<style>.async-hide { opacity: 0 !important} </style>
<script>
(function(a,s,y,n,c,h,i,d,e){s.className+=' '+y;
h.end=i=function(){s.className=s.className.replace(RegExp(' ?'+y),'')};
(a[n]=a[n]||[]).hide=h;setTimeout(function(){i();h.end=null},c);
})(window,document.documentElement,'async-hide','dataLayer',4000,{'GTM-XXXXXX':true});
</script>

Note: Replace GTM-XXXXXX with your Tag Manager container ID (not your Optimize container ID).

ページを非表示にするスニペットは、ページの <HEAD> のなるべく前方(オプティマイズ プラグインの変更済みの Google アナリティクス トラッキング コードの直前)に追加します。

ページを非表示にするスニペットに関する詳細をご覧ください。

この情報は役に立ちましたか?
改善できる点がありましたらお聞かせください。