イベント発生を条件にタグを実行する
では、DataLayerとマクロを使って、ページ内でイベントが発生したときにタグを実行するよう設定してみましょう。ここでは、ページ内イベントをトラッキングする代表的な例として、PDFのダウンロードについて取り上げます。
まずは、PDFへのリンクに下記のように、onclick属性を追加します。
<a href="/pdf/test.pdf" target="_blank" onclick="dataLayer.push([{'event': 'pdfDownload', 'downloadFilename': this.href}]);">Download PDF</a></p>
次に、downloadFilenameで指定した、PDFファイルのパスを取得するため、Google Tag Managerのマクロを定義します。コンテナのサマリー画面から、「新しいマクロ」ボタンをクリックし、「マクロのタイプ」に「データレイヤー変数」、データレイヤー変数名に「downloadFilename」を指定します。
今回は、Google Analyticsのイベントトラッキングテンプレートを使用して、PDFファイルのリンククリックをGoogle Analyticsイベントとして取得します。
コンテナのサマリー画面から、「新しいタグ」ボタンをクリックし、「タグの種類」に「Google アナリティクス」を選択、「ウェブ プロパティ ID」に「UA」から始まるWebプロパティ番号を入力し、「トラッキングタイプ」に「イベント トラッキング」を選択します。
「イベントトラッキングのパラメータ」には、カテゴリ、操作、ラベルを指定しますが、今回は、カテゴリ：「PDF」、操作：「download」、「ラベル」には、先ほど作成した「downloadFilename」を指定します。
「カテゴリ」「操作」はそれぞれ定数ですが、これもマクロを作成して指定します。「カテゴリ」「操作」のプルダウンをそれぞれクリックし、「新しいマクロ」を選択します。「マクロのタイプ」には「定数文字列」、値には「PDF」と「download」をそれぞれ指定します。
パラメータ設定が終わったら、「タグを配信するルールを追加」をクリックして、イベント発生時にこのタグを実行するように指定します。「event」「等しい」「pdfDownload」と指定すると、先ほどのリンクをクリックしたときに、タグが実行されるようになります。
設定が完了したら保存し、コンテナのサマリー画面から「バージョンを作成」ボタンをクリック、「保存してプレビュー」ボタンをクリックして、動作を確認してみましょう。
PDFファイルへのリンクをクリックして、デバッグビューに「Fired on Event “pdfDownload”」と表示されれば成功です。
