レポート
【計測】GTMのトリガー設定時におかしな挙動が起きたら確認したいこと
2025.06.25
1. はじめに
先日、Google タグマネージャー(GTM)でボタンのクリック計測を設定してプレビューを確認したところ、思わぬ挙動にハマってしまいました。
計測初心者の方も、「なんで動いたり動かなかったり?」と混乱しやすい状況かと思います。
この記事では、僕が実際に経験したトラブルとその対策をお届けします。
2. GTMでの設定
まずは普通に設定を入れたケースをご紹介します。
2.1 トリガーの作成
トリガータイプ:クリック - すべての要素
条件:
Click ID が等しい設定内容:
例)my-button
┌─────────────────────────────────┐
│ トリガー名:click_my_button │
│ トリガータイプ:クリック — すべての要素 │
│ Click ID → 等しい → my-button │
└─────────────────────────────────┘
2.2 イベントタグの作成
タグタイプ:GA4 イベント
設定タグ:GA4 計測ID
イベント名:click_my_button
パラメータ:
button_name → {{Click Text}}
3. プレビューで確認
GTM のプレビューモードを開いてサイトを操作。
期待する動き:
ボタンをクリック → タグが発火
実際の挙動:
同じボタンをクリックしても、発火したりしなかったり
4. 注意点・落とし穴
4.1 Data Layer を見ると…
プレビューの Data Layer タブを開くと、gtm.click イベントが発生する要素が毎回違うことが判明。
4.2 原因は要素階層の指定不足
HTML側を見返すと、ボタン内に やアイコン SVG が入っており、クリック要素は実際には
5. 対策
5.1 click_elements で複数セレクタを指定
GTMでは「Click Element」変数を使って、複数のセレクタを OR 条件で指定できます。
設定方法:
トリガー設定画面で「Click Element」に切り替え
設定内容:
#my-button, #my-button *
これで、ボタン本体も子要素もまとめて拾えるようになります。
6. まとめ
- GTMのクリックトリガーは、要素階層まで意識しないといとハマる
- Data Layerタブで実際に発火要素を確認するクセをつける
- 「Click Element」で親+子要素をまとめて指定するのがシンプルでおすすめ
めちゃくちゃ初歩的なミスで焦りましたが、一度深呼吸して Data Layer などをしっかり確認すれば解決できます。
Web制作のご依頼・ご相談お待ちしております。
お気軽にご連絡ください!
この記事が「同じような事象で調べた人」のお役に立てば幸いです。