未経験から100日後にGTMのプロになる話【Day 11】 〜カスタムイベントトリガーの活用 〜dataLayerを使いこなせ！〜〜

■ GTMのカスタムイベントとは？

ここまで、GTMの「クリック」「フォーム送信」などの標準トリガーを使ってイベントを計測してきました。
しかし、すべてのユーザー行動を標準トリガーで計測できるわけではありません。

例えば、 ✅ 動画の再生回数を計測したい
✅ ユーザーがログインした回数を計測したい
✅ 「カートに追加」ボタンのクリックを特定の条件で計測したい

こういったケースでは、「カスタムイベントトリガー」を活用します。

カスタムイベントとは、サイトのJavaScriptが dataLayer.push() を実行したときに、GTMがそのイベントを拾って動作する仕組みです。

つまり、「dataLayerにイベントを送る」→「GTMがそれを受け取ってタグを発火する」 という流れになります。

では、実際にカスタムイベントを使ってみましょう！

① dataLayer.push() を理解しよう

GTMでは、 dataLayer.push() というJavaScriptの関数を使って、サイト内の特定のアクションをGTMに通知できます。

例えば、 ```javascript

`` このコードは、「ユーザーが動画を再生したとき」にdataLayerにevent: 'video_play'` という情報を送るものです。

これをGTMで拾うことで、「動画再生の計測」が可能になります。

✅ 重要ポイント - event キーの値（例：video_play）がカスタムイベント名となる。 - 追加情報（例：video_title や video_duration）を一緒に送ることも可能。

② GTMでカスタムイベントトリガーを作成する

1. カスタムイベントトリガーを作成

1. GTMにログインし、「トリガー」メニューを開く。
2. 「新規」をクリックし、トリガーの種類を「カスタムイベント」に設定。
3. 「イベント名」に video_play と入力。
4. 「このトリガーの発火を...」は「すべてのカスタムイベント」のまま。
5. トリガー名を「動画再生イベント」として保存。

✅ これで、event: 'video_play' が dataLayer に送信されたときにGTMが反応できるようになります！

③ GA4に動画再生イベントを送信するタグを作成する

カスタムイベントをGA4に送信するためのタグを作成します。

1. GA4用のイベントタグを作成する

1. GTMの「タグ」メニューを開く。
2. 「新規」をクリックし、タグの種類を「Google アナリティクス: GA4 イベント」に設定。
3. 「設定タグを選択」で、すでに作成したGA4設定タグを選択。
4. 「イベント名」を video_play にする。

2. イベントパラメータを設定する

1. 「イベントパラメータを追加」ボタンをクリック。
2. 以下のパラメータを追加。
3. パラメータ名: video_title（値: {{video_title}}）
4. パラメータ名: video_duration（値: {{video_duration}}）
5. 保存。

✅ これで、動画が再生されたときに「動画タイトル」「動画の長さ」と一緒にGA4へデータを送ることができます！

④ プレビューモードで動作確認

タグを本番適用する前に、必ずプレビューモードでテストしましょう。

1. GTMの「プレビュー」を開く。
2. 計測対象のサイトを開き、動画を再生。
3. デバッグツールの「Data Layer」タブを確認し、 video_play イベントが送られているか確認。
4. 「Tags Fired（発火したタグ）」にGA4のイベントタグがあるか確認。
5. GA4のリアルタイムレポートで video_play が記録されているか確認。

✅ 問題なくデータが送信されていることを確認したら、GTMの「送信」ボタンを押して公開！

■ まとめ 〜カスタムイベントで自由な計測を実現！〜

今回の学びを整理すると...

✅ dataLayer.push() を使えば、GTMに自由なイベントを送れる！
✅ カスタムイベントトリガーを作成すると、GTMが特定のイベントをキャッチできる！
✅ GA4のイベントタグを作成し、カスタムイベントをデータとして送信する！
✅ 「プレビューモード」でテストし、問題なければ公開する！

この設定を活用すれば、マーケターも「開発者と協力してより高度な計測を実装」 できるようになります。

例えば... - 動画の視聴率を測る → video_play の回数をGA4で分析 - ログインイベントを測る → user_login の回数をGTM経由で計測 - カート追加イベントを測る → add_to_cart をEコマースデータと一緒に送信

など、サイトの動きをより詳細に把握できるようになります。

■ 明日の予告 〜データレイヤー変数を活用する〜

次回は、データレイヤー変数を活用して「カスタムイベントで取得したデータをもっと柔軟に扱う方法」を学びます！

これをマスターすれば、さらに高度なタグ管理が可能になります。

明日も引き続き、GTMの応用スキルを磨いていきましょう！