Google Tag Manager（GTM）を使ってGA4の計測タグを設置したけど、本当に正しくデータが送信されているか不安な方も多いのではないでしょうか？
この記事では、GTMで設置したGA4の計測タグが発火しているかどうかを、実際にご自身のサイトで確認する方法を、初心者の方にもわかりやすく解説しています。
GTMの設定から、Googleアナリティクス上での確認方法まで、ステップバイステップでご紹介します。
GTMの導入やアカウントの作成
GTMの基本や導入方法については下記をご参考ください。
この記事ではボタンクリックを計測するタグとトリガーの作成、および、GA4でその結果を確認する方法をまとめています。
設定の流れ
ここでは、ボタン要素にid名を指定し、そのid名の要素がクリックされたときに、カスタムイベントを発火させます。
設定の流れは以下のようになります。
- 対象の要素にIDを埋め込む
- タグを作成する（カスタムイベント名の設定）
- トリガーの設定
- プレビューで動作確認
- 公開
- GA4で確認
対象の要素にIDを埋め込む
まずは計測したい要素にidを設定します。
ここでは以下のようなセミナー参加申し込みボタンに「id=lp1-cv-btn-2」を設定します。
タグの作成
タグタイプの指定（Googleタグ）
対象のコンテナを選択して、左メニューの「タグ」をクリックします。
右上の「新規」をクリックします。
タグの名前を入力し、「タグの設定」をクリックします。
タグタイプで「Googleアナリティクス 」を選択します。
この中の「Googleアナリティクス:GA４イベント」を選択します。
タグタイプで「Googleタグ」を選択すると、カスタムイベント名が設定できません。カスタムイベント名が設定できないと、GA4でイベント一覧を表示したときに対象のタグの発火の識別ができません。
測定IDの指定（GA4のデータストリームの測定ID）
「測定ID」にGA4のデータストリームの測定IDを入力します。（※以下ではGTMで設定した定数で呼び出しています。定数を設定する方法はこちらをご参考ください）
「このコンテナでGoogleタグが見つかりました」と表示されればOKです。
データストリームとは何か？
データストリームとはデータ発信元の識別IDです。「G-XXXXXXXXXX」というものです。これを入力することで、指定したGA4で計測することを指定することがきます。
データストリームはGoogleアナリティクスを開いて「設定 > プロパティ設定 > データの収集と修正 > テータストリーム」から取得できます。
イベント名の設定
GA4で計測時に表示させるイベント名を指定します。ここではid名と同じ「lp1-cv-btn-2」を指定します。
必要に応じて「イベントパラーメタ」を設定します（なくても問題ありません）。
以上でタグの設定は完了です。
トリガーの設定
続いてトリガーを選択します。
右上の「＋」をクリックします。
トリガー名を入力し、「トリガーの設定」をクリックします。
トリガーのタイプを選択します。
ここではボタンのクリックを計測したいので「クリック > すべての要素」を選択します。
指定したボタンのみ計測したいので、トリガーの発生場所を「一部のクリック」にします。
次に、イベント発生の条件を指定します。
「組み込み変数を選択します」を選択します。
組み込み変数には様々なものが用意されています。
ここでは、id名で要素を指定するので「Click ID」を指定します。
条件を「等しい」にして、ボタンに設置したid名入力します（※#は不要）
右上の「保存」をクリックします。
以上で、タグとトリガーの設定は完了です。最後に「保存」をクリックします。
指定したタグが追加されます。
（補足）クリックの組み込み変数
クリック条件の６つの組み込み変数
GTMでクリックで指定できる組み込み変数には、以下の６つがあります。
- Click Element
- Click Classes
- Click ID
- Click Target
- Click Text
- Click Element
- クリックされた要素全体を指定します。
- 例：特定のボタンやリンクの要素タグ（<button>、<a>など）を指定することで、その要素がクリックされた時にトリガーが発火します。
- 最も一般的な条件で、多くの場合、この条件だけで十分に特定できます。
- Click Classes:
- クリックされた要素に付与されているクラス属性を指定します。
- 例：複数のボタンに同じクラス名「btn-primary」が付与されている場合、このクラス名を持つボタンがクリックされた時にトリガーが発火します。
- 複数の要素に共通するクラス名でトリガーを設定したい場合に有効です。
- Click ID:
- クリックされた要素のID属性を指定します。
- 例：各ボタンにユニークなIDが割り当てられている場合、特定のIDを持つボタンがクリックされた時にトリガーが発火します。
- 各要素を完全に一意に特定したい場合や、JavaScriptで動的に生成される要素を特定したい場合に有効です。
- Click Target:
- クリックされたリンクのターゲット属性を指定します。
- 例：”_blank”というターゲット属性を持つリンクがクリックされた時にトリガーが発火します。
- リンクの遷移先を制御するターゲット属性を条件にしたい場合に有効です。
- Click Text:
- クリックされた要素のテキスト内容を指定します。
- 例：”送信”というテキストが表示されているボタンがクリックされた時にトリガーが発火します。
- 要素のテキスト内容が変化する可能性がある場合や、テキストの内容でトリガーを分岐させたい場合に有効です。
具体的な使い分け例
- 特定のボタンをクリックした場合: Click ElementまたはClick ID
- 複数のボタンに共通のクラスを持つボタンをクリックした場合: Click Classes
- 新しいウィンドウで開かれるリンクをクリックした場合: Click Target
- “購入”ボタンをクリックした場合: Click Text
どの条件を使うべきか
- 優先順位: 一般的には、Click ID > Click Classes > Click Elementの順で優先的に利用します。
- 複数の条件を組み合わせる: 必要に応じて複数の条件を組み合わせることで、より正確なトリガー設定を行うことができます。
- 動的な要素: JavaScriptで動的に生成される要素の場合は、Click IDやClick Classesが有効な場合があります。
タグのテスト（プレビュー）
現段階ではまだこのタグは有効化していません。
「タグ」メニューで右上の「プレビュー」をクリックすると、タグが正しく発火しているか検証することができます。
対象のページのURLを入力して「リンク」をクリックします。
ページが表示されるので、対象の要素をクリックします。
ボタンをクリックしたらプレビュー画面を閉じます。
タグが正しく設定できてれば、「配信されたタグ」の中に設定したタグが表示されます。
クリックすると詳細が確認できます。
イベント名に指定した値が表示されていることがポイントです。
以上で確認は完了です。
公開する
メニューで「タグ」に戻って右上の「公開」をクリックします。
必要に応じてバージョン名や説明を入力します（入力しなくても大丈夫です）。
右上の「公開」をクリックします。
「続行」をクリックします。
以上でタグの公開は完了です。これで実際に計測できる状態になります。
GA4での確認
設定したタグが発火したことをGA4で確認します。
まずは、タグを設定したボタンをクリックして、タグを発火させます。
「レポート > エンゲージメント > イベント」を選択します。
イベント一覧の「click」を選択します。
パラメータ名で「link_id」を選択します。
すると、タグが発火したときに送信されたid名が表示されます。
