Googleタグマネージャーについて更に学習

Googleタグマネージャーについてまだ「一通り理解した」感が得られていないので、タグマネージャーヘルプを教科書にもう少し学習します。

Google タグ マネージャーのウェブページ スニペットでは、デフォルトで HTTPS が使用される。
コンテナをセキュリティで保護されていないページに導入する必要がある場合は、コンテナ スニペットのソース URL プロトコルに https:// ではなく // を使用する。
セキュリティで保護されているページでカスタムタグを配信する場合は、そうしたタグもプロトコル連動かセキュアである必要がある。

カスタム HTML でタグ マネージャーの変数を追加するには、二重の中かっこで変数名を囲む。

<script>
 var foo = {{bar}}
</script>

「タグ配信の優先度」
タグを配信する順番を決める。
正か負の整数値を入力し、値の高いタグが低いタグの前に配信される。
例）たとえば優先度 3 のタグは、優先度 1 と 2 のタグの前に配信される。
特に指定がなければ、デフォルトの 0 が使用されるが、タグは非同期で配信される。

「カスタムのタグ配信スケジュールを有効にする」
タグを配信する期間を設定できる機能。

「公開されたコンテナでのみ、このタグを配信する」
テスト環境（プレビュー、デバッグなど）ではタグを配信しないようにする設定。

タグ呼び出しオプション

  • 無制限
    トリガー条件が満たされるたびにタグを配信する（このオプションはタグの順序付けでのみ使用される）。
  • 1 回のイベントにつき 1 度
    指定したイベントが発生したときに、タグを一度だけ配信する。同じデータに含まれる複数の情報がデータレイヤーに追加されないようにする必要がある場合は、このオプションを使用する。
  • 1 ページにつき一度
    ページの読み込み時に、タグを一度だけ配信する。このオプションは通常、ページの読み込み時に外部の JavaScript ライブラリを一度だけ読み込む必要がある場合に使用する。

タグの順序付けを使用すると、特定の「メイン」のタグの直前または直後に配信するタグを指定できる。

  • 設定タグ　…　「メイン」タグの前に配信されるタグ。
  • クリーンアップタグ　…　メインのタグの直後に配信されるタグ。

デベロッパーが設定タグのデータレイヤー値を変更する場合は、google_tag_manager[{{Container ID}}].dataLayer.set() を使用する必要がある。
→　push() の代わりに .set() を使用

トリガー例外（または「ブロッキング トリガー」）は、特定の条件下で別のトリガー機能が発動するのをブロックするために使用できるトリガーの一種。
例）配信トリガーとして「すべてのページ」、トリガー例外として「Page URL equals thankyou.html」が設定されている場合、「thankyou.html」ページではタグが配信されない。

ページの読み込みイベントをトラッキングするトリガーは 3 種類ある。

  • ページビュー
    ウェブブラウザがページの読み込みを開始するとすぐに発動。
    ページのインプレッションから生成されたデータのみが必要な場合は、このオプションを使用する。
  • DOM Ready
    ブラウザで HTML のページの読み込みが完全に終了した後、ドキュメント オブジェクト モデル（DOM）が解析できる状態になった後に発動。
    DOM に対応して変数に値が入力されるページベースのタグの場合は、タグ マネージャーで正しい値が使用されるよう、このタイプのトリガーを選択する。
  • ウィンドウの読み込み
    画像やスクリプトなどの埋め込みリソースを含め、ページが完全に読み込まれた後に発動。

「要素の表示」トリガー
選択した要素がウェブブラウザのビューポートに表示されると発動。
要素を表示させるイベントには、「ページの読み込み」「ページのスクロール」「ブラウザタブのフォアグラウンドへの移動」「要素の位置や表示に影響を与える自動タスク」などがある。

このトリガーを発動するタイミング

  • 1 ページにつき 1 度
    各ページ 1 回だけトリガーが発動。
    指定した ID や CSS セレクタに一致する要素が同じページ内に複数ある場合は、そのうちのいずれかが初めて視認可能になったタイミングでのみ発動。
  • 1 要素につき 1 度
    各ページで、指定した要素ごとに 1 回だけトリガーが発動。
    指定した CSS セレクタに一致する要素が同じページ内に複数ある場合は、要素ごとに初めて視認可能になったタイミングで発動する。
    同じ ID を持つ要素がページ内に複数ある場合、最初に一致した要素についてのみ発動する。
    ただし、[詳細] 設定で [DOM の変化をモニタリング] をオンにしている場合、最初に一致した要素がモニタリング対象の DOM の変化によって削除されれば、同じ ID を持つ別の要素によって再びトリガーが発動することもある。
  • 各要素が画面に表示されるたび
    条件に一致した要素が視認可能になる（プログラムによるか、ユーザー操作により）たびに発動。

ユーザーがページを再読み込みしたり、新しいページに移ったりすると、トリガーはリセットされ、指定した要素の視認可能性に応じて再度発動する。

各要素の表示時間は、ページごとの累計値で計算される。
よって、ある要素が 5,000 ミリ秒間にわたって視認可能だった後、いったん見えなくなり、その後もう一度 5,000 ミリ秒間表示された場合は、表示時間は 10,000 ミリ秒間と認識される。
ユーザーがページを再読み込みしたり、新しいページに移ったりすると、トリガーも表示時間もリセットされる。

[画面上での最小表示時間を設定] や [DOM の変化をモニタリング] がオンの場合、Google タグ マネージャーは選択された要素の状態をモニタリングするため、条件に合致する要素がページ内に複数ある場合、ページのパフォーマンスが影響を受ける。

フォーム送信トリガーが発動すると、次の組み込み変数が入力される。

  • Form Element: クリックされたフォーム要素。
  • Form Classes: フォームのクラス属性に入力されている値の配列。
  • Form ID: フォーム要素の ID 属性。
  • Form Target: フォーム要素のターゲット属性。
  • Form URL: フォーム要素の HREF 属性（存在する場合）。
  • Form Text: フォーム内の表示テキスト。

履歴変更のイベントに基づくトリガーは、URL の一部（ハッシュ）が変更されたとき、またはサイトで HTML5 pushState API が使用されたときにタグを配信する。
このトリガーは、Ajax アプリケーションなどの仮想ページビューをトラッキングするタグを配信する場合に便利。

履歴変更のイベントが発生すると、次の変数に値が入力さる。

  • History old url fragment: 変更前の URL の一部。
  • History new url fragment: 変更後の URL の一部。
  • History old state: 変更前の履歴状態のオブジェクト（サイトの pushState の呼び出しによって設定される）。
  • History new state: 変更後の履歴状態のオブジェクト（サイトの pushState の呼び出しによって設定される）。

 JavaScript エラートリガーは、捕捉できなかった JavaScript の例外（window.onError）が発生したときにタグを配信する場合に使用。
このタグを使用して、解析ツールにエラー メッセージを記録することができる。
JavaScript エラー変数を使用してエラー メッセージを取得し、タグが配信されたときにその変数の値を送信する。

トリガーが発動すると、次の組み込み変数に値が入力される。

  • Error message: JavaScript のエラー メッセージのテキスト。
  • Error URL: エラーが発生したページの URL。
  • Error line: コード内でエラーが検出された行の番号。

「スクロール距離」トリガーを使用すると、ユーザーがウェブページをどれだけ下もしくは横にスクロールしたかに応じてタグを配信できる。

スクロールの距離を複数指定する場合はカンマ区切りで入力する。
たとえば、割合を選択して、10、50、90 と入力すると、ページの高さの 10％、50％、90％ の地点がそれぞれトリガーの発動ポイントに設定される。
このトリガーがタグに適用された状態で、ユーザーがページの下部に向かって 90％ スクロールすると、タグは 3 回配信される（10％ で 1 回、50％ で 1 回、90％ で 1 回）。
トリガーが発動するのは、各ページで発動ポイントを初めて通過したときのみ。
ユーザーが上にスクロールして戻っても、トリガーは発動しない。

無限（動的）にスクロールするページやサイズが大幅に変動するページには、「要素の表示」トリガーを使用する。

スクロール距離トリガーの発動ポイントが、ページを読み込んだ時点でビューポートに入っている場合、ユーザーが実際にページをスクロールしていなくてもトリガーが発動する。

スクロール距離トリガーが発動すると、次の組み込み変数に自動的に値が入力される。

  • Scroll Depth Threshold: トリガー発動につながったスクロール距離を示す数値。
  • Scroll Depth Units: トリガー発動のしきい値の指定に使用されている単位（「%」または「ピクセル」）。
  • Scroll Direction: トリガー発動につながったスクロールの方向（「縦方向」または「横方向」）。

「タイマー」トリガーを使用すると、一定の間隔でタグ マネージャーにイベントを送信できる。
これにより、ユーザーがページでタスク（記事を読む、フォームに記入する、購入を完了するなど）を完了するまでの時間を測定できる。

「トリガー グループ」では、複数のトリガーの条件を 1 つの条件として評価する。
選択したすべてのトリガーが 1 回以上配信された後にのみ配信される。
特定のトリガーの複数のインスタンスを追加する場合は、トリガー グループの配信前に、そのトリガーを対応する回数にわたって配信する必要がある。