Googleタグマネージャー(GTM)の画面は「タグ」「トリガー」「変数」の3つでできています。タグは「何を送るか」、トリガーは「いつ送るか」、変数は「そのとき何の値を使うか」です。この3つの役割と、組み込み変数で済む場面とデータレイヤーを使うべき場面の線引きが分かれば、ボタンのクリックやフォーム送信の計測を自分で組めて、あとから見た人にも意図が伝わるコンテナになります。前提として、GTMのコンテナがサイトに入っていて、Googleアナリティクス4(GA4)のGoogleタグが1つ置かれている状態から始めます。画面の名前と仕様は2026年10月時点のタグ マネージャー ヘルプで確かめたものです。
例は、スタッフ6名ほどの予約制の料理教室「サンプル料理教室」のサイト sample-cooking.example(WordPress)です。体験レッスン申込フォームとサンクスページ /thanks/、電話番号のボタン、LINE公式アカウントの友だち追加ボタン、Instagramへのリンクがあり、通常レッスンの予約は外部の reserve.example で受けています。
先に決めること
トリガーと変数を作り始める前に、次の4つを決めておきます。ここを曖昧にしたまま作ると、半年後に同じ意味のトリガーが3つ並び、どれを消してよいか誰も分からなくなります。
- 何をキーイベント(旧コンバージョン)にするか。サンプル料理教室では「体験申込完了」「電話タップ」「LINE追加」の3つに絞ります。Instagramへのリンクや予約システムへの移動は、数えはしてもキーイベントにはしません
- 値をどこから取るか。画面に出ている情報(リンク先URL、ボタンの文字、ページのURL)で足りるなら組み込み変数で取ります。画面に出ない情報(どのレッスンへの申込か、フォームが本当に送れたか)はサイト側からデータレイヤーで渡してもらいます
- サイトのコードを誰が触るか。サンプル料理教室のテーマは外部の制作会社が作っていて、テーマの直しは制作会社に頼みます。データレイヤーを使う計測は制作会社への依頼が要るので、頼む内容(イベント名とキー名)をこちらで決めて渡します
- 名前の付け方。タグ・トリガー・変数の名前の型を最初に決めます。型は後半の「命名のルールとフォルダ」で書きます
判断の目安は単純です。組み込み変数とクリック・ページビューのトリガーで取れるものは、まずそれで取ります。画面の見た目が変わると壊れる計測や、送信の成否のようにブラウザの表面からは分からない情報だけをデータレイヤーに回します。データレイヤーは確実ですが、サイトの修正が要る分だけ手間と待ち時間がかかります。
一覧の表
トリガーの種類と使う場面
タグ マネージャー ヘルプの「トリガーの種類」に載っているもののうち、ウェブサイトで使う主なものです。
| 分類 | トリガー | 動くとき | サンプル料理教室での使い道 |
|---|---|---|---|
| ページビュー系 | 同意の初期化 | ほかのすべてのトリガーより前 | 同意管理ツールのタグ、同意のデフォルト値を設定するタグだけ |
| ページビュー系 | 初期化 | 同意の初期化の次に早い | GA4のGoogleタグ(ほかより先に読み込みたいもの) |
| ページビュー系 | ページビュー | ページの読み込みが始まった直後 | サンクスページ /thanks/ の表示で申込を数える |
| ページビュー系 | DOM Ready | HTMLを読み終わり、ページの要素を読める状態になった後 | ページ内の文字や要素の値を変数で読むタグ |
| ページビュー系 | ウィンドウの読み込み | 画像やスクリプトまで全部読み込んだ後 | 読み込みが遅くてもよい広告系のタグ |
| クリック | すべての要素 | ボタン・画像など何かがクリックされたとき | リンクではないボタン(button 要素)のクリック |
| クリック | リンクのみ | <a> のリンクがクリックされたとき | 電話(tel:)、LINE追加、Instagram、予約システムへのリンク |
| フォームの送信 | フォームの送信 | フォームの送信イベントが起きたとき | 送信後にページが変わらないフォーム(使えないことも多い) |
| スクロール距離 | 縦方向・横方向 | 指定した割合かピクセルまで初めて下がったとき | 料金ページを最後まで読んだかを見たいとき |
| 要素の表示 | 要素の表示 | 指定した要素が画面に入ったとき | 送信後に同じページに出る「送信しました」の表示 |
| タイマー | タイマー | 指定した間隔ごと | ほぼ使わない(GA4のエンゲージメントで足りる) |
| その他 | カスタム イベント | データレイヤーに指定の event が入ったとき | 制作会社に入れてもらった「申込完了」の合図 |
| その他 | 履歴の変更 | URLのハッシュが変わったか、pushStateが使われたとき | ページを読み直さずに画面が切り替わるサイトだけ |
このほかに YouTube 動画トリガーと JavaScript エラートリガーもあります。動画はGA4の拡張計測機能でも取れるので、まずはそちらで足ります。
変数の種類
| 種類 | 何が入るか | 使う場面 |
|---|---|---|
| 組み込み変数 | Page URL、Click URL、Click Text、Form ID などGTMが用意している値 | クリックやページの条件。最初にこれで足りるかを見る |
| データレイヤー変数 | dataLayer.push() で渡された値 | 画面に出ない値(レッスンの種類、申込の成否) |
| 定数 | 決まった文字列 | 複数のタグで使う同じID |
| JavaScript 変数 | ページにあるグローバル変数の値 | ページのソースにすでにある値を読む |
| カスタム JavaScript | 関数が返した値 | 取り出した値を加工する(小文字にそろえる、近くの要素を探す) |
| ルックアップ テーブル | 別の変数の値に応じて決めた値 | URLからページの種類名に置き換える |
| 正規表現の表 | 正規表現で一致した行の値 | ルックアップ テーブルでは行が多くなりすぎるとき |
手順
組み込み変数を有効にする
組み込み変数は最初から全部使えるわけではなく、使うものを有効にします。
- 左のメニューで「変数」を開きます。
- 「組み込み変数」の「設定」を押します。
- 「クリック」の Click Element、Click Classes、Click ID、Click URL、Click Text にチェックを入れます。
- 「フォーム」の Form ID、Form URL にもチェックを入れます。
- 「スクロール」の Scroll Depth Threshold を、スクロールを測るときだけ有効にします。

トリガーの条件を作る画面で「組み込み変数を選択します」から選んでも、その場で有効になります。
組み込み変数とクリックトリガーで電話タップを取る
電話番号のボタンは <a href="tel:03-0000-0000"> のようなリンクです。リンク先が tel: で始まるので、Click URL だけで見分けられます。
- 左のメニューで「トリガー」を開き、「新規」を押します。
- 「トリガーの設定」を押し、「クリック – リンクのみ」を選びます。
- 「このトリガーの発生場所」で「一部のリンククリック」を選びます。
- 条件を
Click URL先頭が一致tel:にします。 - 名前を
クリック - 電話リンクにして保存します。

このトリガーに、GA4のイベントタグ(タグの種類は「Google アナリティクス: GA4 イベント」、イベント名は tel_tap)をつなぎます。「タグの配信を待つ」と「妥当性をチェック」は、リンクのみとフォームの送信のトリガーに出る設定です。電話リンクではページが移動しないので、どちらもオフのままで困りません。
ボタンの位置を分けたいとき(ヘッダーの電話ボタンか、料金ページ下の電話ボタンか)は、Click Text やクリックされた要素の場所を変数で取り、イベントパラメータに入れます。ここから先は「GTMでボタンのクリックを計測する:電話・LINE追加・資料請求」で詳しく書いています。
データレイヤーの仕組み
データレイヤーは、ページからGTMへ値を渡すための入れ物です。中身は dataLayer という名前の配列で、サイト側が dataLayer.push() で値を入れると、GTMが入った順に1件ずつ読み取ります。event というキーを入れると、それがGTMにとっての「出来事」になり、カスタム イベント トリガーで受け取れます。
決まりは次のとおりです。
- 初期化は
window.dataLayer = window.dataLayer || [];と書き、GTMのコンテナ スニペットより前に置きます dataLayer = [ ... ]と直接代入すると、それまでに入っていた値が消えます。値を足すときは必ずpush()を使いますdataLayerは大文字と小文字を区別します。datalayerと書くと動きませんpush()の中のキー名は引用符で囲みます- 同じ名前のキーをもう一度入れると、前の値は上書きされます
- 値はそのページの中でしか残りません。次のページでも使う値は、ページごとにまた入れます
ページの種類のように、表示した時点で決まっている値は、コンテナ スニペットの前で入れておきます。
<script>
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
'page_category': 'lesson',
'lesson_type': 'bread'
});
</script>
<!-- この下にGTMのコンテナ スニペット(GTM-XXXXXXX) -->
申込が完了した瞬間のように、ページを開いたあとで起きる出来事は、event を付けて入れます。サンプル料理教室では、体験レッスンのフォームが送信に成功したときに、制作会社に次の1行を入れてもらいます。
<script>
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
'event': 'trial_submit',
'form_name': 'trial_lesson',
'lesson_type': 'bread'
});
</script>
制作会社への依頼では、イベント名 trial_submit、キー名 form_name と lesson_type、値の候補(bread、japanese、sweets など)、入れるタイミング(送信に成功したとき。入力エラーのときは入れない)を文書で渡します。キー名の大文字・小文字やつづりがずれると受け取れないので、口頭で伝えないことです。

データレイヤー変数を作る
push() で入った値は、データレイヤー変数を作って初めてタグやトリガーで使えます。
- 左のメニューで「変数」を開きます。
- 「ユーザー定義変数」の「新規」を押します。
- 「変数の設定」を押し、「データレイヤーの変数」を選びます。
- 「データレイヤーの変数名」に
lesson_typeと入れます(push()のキー名と完全に同じにする)。 - 「データレイヤーのバージョン」は「バージョン 2」のままにします。
- 名前を
DLV - lesson_typeにして保存します。 - 同じように
DLV - form_nameも作ります。

バージョン 2 では、キー名のドットを入れ子として読みます。{'lesson': {'type': 'bread'}} と入れた値は、変数名を lesson.type にすると取り出せます。バージョン 1 はドットを含んだ1つのキー名として扱うので、特別な理由がなければバージョン 2 で困りません。
カスタム イベントのトリガーで受け取る
- 左のメニューで「トリガー」を開き、「新規」を押します。
- 「トリガーの設定」を押し、「カスタム イベント」を選びます。
- 「イベント名」に
trial_submitと入れます。 - 「このトリガーの発生場所」は「すべてのカスタム イベント」のままにします。
- 名前を
CE - trial_submitにして保存します。 - 「タグ」で「新規」を押し、タグの種類「Google アナリティクス: GA4 イベント」を選びます。
- 測定IDに
G-XXXXXXXXXX、イベント名にgenerate_leadを入れます。 - イベントパラメータに、パラメータ名
form_name・値{{DLV - form_name}}、パラメータ名lesson_type・値{{DLV - lesson_type}}を足します。 - トリガーに
CE - trial_submitを選び、名前をGA4 - イベント - 体験申込完了にして保存します。


「正規表現一致を使用」にチェックを入れると、イベント名を正規表現で書けます。^(trial_submit|contact_submit)$ のように、受けたいものを全部書き出して使います。.* と書くと、GTMやGoogleタグが自動で出すイベントにも全部反応するので使いません。
GA4のレポートでパラメータの値(パンかお菓子か)を見るには、GA4側でカスタム ディメンションに登録します。「管理」→「データの表示」→「カスタム定義」から、範囲を「イベント」、イベント パラメータを lesson_type にして作ります。レポートやデータポータル(Looker Studio)で使えるようになるまで24〜48時間かかります。
条件の書き方(含む・一致・正規表現)
トリガーの条件は「変数」「演算子」「値」の3つでできています。条件を複数並べると、全部を満たしたときだけ動きます(「または」にはなりません)。
| 演算子 | 意味 | 例 | 注意 |
|---|---|---|---|
| 等しい | 完全に同じ | Page Path 等しい /thanks/ | 末尾の / の有無で外れる |
| 含む | 一部に含む | Click URL 含む reserve.example | 思わぬURLも拾う |
| 先頭が一致 | 先頭が同じ | Click URL 先頭が一致 tel: | 電話・メールのリンク向き |
| 末尾が一致 | 末尾が同じ | Click URL 末尾が一致 .pdf | クエリ付きURLで外れる |
| 正規表現に一致 | パターンに合う | Page Path 正規表現に一致 ^/thanks/?$ | 部分一致なので ^ と $ で囲む |
| CSS セレクタに一致する | 要素がセレクタに合う | Click Element CSS セレクタに一致する .line-btn, .line-btn * | 中の画像や文字がクリックされることがある |
| 小さい・大きい | 数値の比較 | Scroll Depth Threshold 大きい 50 | 数値の変数にだけ使う |
それぞれに「含まない」「等しくない」のような否定の形と、正規表現には大文字と小文字を区別しない形があります。演算子の名前の細かい表記(「CSS セレクタに一致する」「含まない」「等しくない」など)はヘルプに書かれていないので、画面の一覧で確かめてください。
正規表現は部分一致で動きます。ヘルプの例では /pro/ が products、promotions、processes のどれにも一致します。サンクスページを thanks だけで書くと、ブログの「thanks-giving-cake」のような記事にも当たります。ページのパスは ^/thanks/?$ のように先頭と末尾まで書きます。. は「何でも1文字」の意味なので、ドメインを書くときは reserve\.example と前に \ を付けます。
LINE追加ボタンが複数あり、友だち追加のURLが2種類あるときは、1つのトリガーで Click URL 正規表現に一致 ^https://(lin\.ee|line\.me)/ のように書くと、トリガーを2つ作らずに済みます。
例外(ブロック)を付ける
タグの設定のトリガー欄は「配信トリガー」と「例外」の2つに分かれています。例外に入れたトリガー(ヘルプでは除外トリガー、ブロックトリガーとも呼びます)は配信トリガーより強く、両方が当てはまるとタグは出ません。
サンプル料理教室では、Meta広告のピクセルを全ページで出しつつ、制作会社が確認用に使うテストページ /test/ では出したくない、という場面で使います。
- 「トリガー」で「新規」を押し、「ページビュー」を選びます。
- 「一部のページビュー」を選び、
Page Path先頭が一致/test/にします。 - 名前を
除外 - テストページにして保存します。 - 「タグ」で対象のタグを開き、「トリガー」を押します。
- 「例外」欄の右の「+」を押し、
除外 - テストページを選んで保存します。

実際に運用していると、例外が効かないという相談のほとんどは、トリガーの種類のずれです。配信トリガーがクリックで、例外のトリガーがページビューだと、クリックの瞬間に例外の条件が判定されず、タグはそのまま出ます。例外のトリガーは配信トリガーと同じ種類で作ります。どの種類で作ればよいか迷うときは、例外にせず、配信トリガーの条件に Page Path 先頭が一致しない /test/ を足すほうが確実です。
命名のルールとフォルダで整理する
タグ マネージャー ヘルプは「アイテムタイプ – アプリ名 – 詳細」の形の名前を勧めています。小さな会社のサイトはコンテナが1つなので、アプリ名の部分は省いて、種類と中身で付けます。
| 対象 | 名前の型 | サンプル料理教室の例 |
|---|---|---|
| タグ | ツール – 種類 – 中身 | GA4 - イベント - 体験申込完了 |
| タグ | ツール – 種類 – 中身 | Google広告 - コンバージョン - 体験申込 |
| トリガー | 種類 – 条件 | クリック - 電話リンク |
| トリガー | 種類 – 条件 | CE - trial_submit |
| トリガー | 除外 – 条件 | 除外 - テストページ |
| 変数 | 種類 – キー名 | DLV - lesson_type |
| 変数 | 種類 – 中身 | 定数 - GA4測定ID、LT - ページ種別 |
トリガーの名前に「どのタグに使うか」を書かないのがこつです。同じトリガーを別のタグにも使うと名前と中身がずれるので、条件だけを書いておきます。
フォルダは次の手順で作ります。
- 左のメニューで「フォルダ」を開きます。
- 「新しいフォルダ」を押して名前を付けます。
- 「タグ」「トリガー」「変数」の一覧でチェックを入れ、「移動」から入れるフォルダを選びます。

フォルダはタグの種類ごとか、目的ごとに分けます。サンプル料理教室では「01 計測の土台」(Googleタグ・定数・ページ種別)、「02 キーイベント」(体験申込・電話・LINE)、「03 広告」(Google広告とMeta広告)、「99 停止中」(使っていないもの)の4つにしています。使わなくなったタグは、消すか迷う間は一時停止にして「99 停止中」に入れ、次の見直しで消します。
人に引き継ぐときは、名前とフォルダに加えて、次の2つを残します。
- ワークスペース右上の「公開」を押し、送信設定の「バージョンの公開と作成」を選んだ画面で、バージョン名と説明に何を変えたかを書く(「体験申込のlesson_typeを追加」)。ワークスペースの説明は、そのままバージョンに引き継がれます
- データレイヤーのイベント名とキー名の一覧を、制作会社に渡した依頼書と一緒に保管する。サイトを作り直したときに同じ名前で入れ直してもらえば、GTM側は何も直さずに済みます
応用
ルックアップ テーブルでページの種類を付ける
URLのままでは、データポータルで「ブログからの申込」と「料金ページからの申込」を分けにくいので、ページの種類名に置き換えた変数を作ります。
| 入力(Page Path) | 出力 |
|---|---|
/ | top |
/lesson/ | lesson |
/price/ | price |
/teacher/ | teacher |
/access/ | access |
- 「変数」の「ユーザー定義変数」で「新規」を押し、「ルックアップ テーブル」を選びます。
- 「入力変数」に
{{Page Path}}を選びます。 - 上の表の5行を入れます。
- 名前を
LT - ページ種別にして保存します。
ブログの記事は /blog/ の下に何百ページもあり、ルックアップ テーブルでは書ききれません。この場合は「正規表現の表」で ^/blog/ → blog の1行を足します。正規表現の表は上から順に調べて、最初に一致した行の値を返します。どれにも一致しないときの値は「デフォルト値を設定」で other にしておくと、空欄が並びません。
定数でIDをまとめる
Google広告のコンバージョンIDのように、複数のタグで同じ値を使うものは定数の変数にします。IDが変わったときに直すのが1か所で済みます。名前は 定数 - Google広告ID のようにします。
JavaScript 変数とカスタム JavaScript
ページのソースに、テーマがすでにグローバル変数を出していることがあります。たとえば予約システムの埋め込みが window.reserveConfig を置いているなら、JavaScript 変数で reserveConfig.planName を指定して読めます。
画面上の値を加工したいときは、カスタム JavaScript を使います。値を返す関数の形で書きます。次は、クリックされた要素が data-area を持つ枠の中にあれば、その値(header、price-bottom など)を返す変数です。
function () {
var el = {{Click Element}};
if (!el || !el.closest) { return 'unknown'; }
var box = el.closest('[data-area]');
return box ? box.getAttribute('data-area') : 'other';
}
data-area の属性はテーマに入っている必要があるので、制作会社に「ボタンを囲む枠に data-area="header" のように付けてほしい」と頼みます。サイトの見た目は変わらないので、引き受けてもらいやすい依頼です。
スクロールと要素の表示は、GA4の拡張計測機能と重ねない
GA4の拡張計測機能は、ページの90%まで下がったときに scroll イベントを自動で送ります。GTMのスクロール距離トリガーで90%を足すと二重になります。GTMで作るのは、25%・50%・75%のように拡張計測機能に無い深さを取りたいときだけです。サンプル料理教室では、料金ページだけ Page Path 等しい /price/ に絞って、50, 75 の2つを取っています。
要素の表示トリガーは、送信後にページが変わらないフォームの「送信しました」の表示を数えるのに使えます。「選択方法」で「CSS セレクタ」を選び、完了メッセージの要素を指定します。「DOM の変化をモニタリング」にチェックを入れないと、送信後に現れた要素は見つかりません。
できないことと、その代わり
| できないこと | 理由 | 代わりの手 |
|---|---|---|
| reserve.example(外部の予約システム)の中の申込を数える | 別ドメインで、こちらのGTMが入っていない | 予約システムの管理画面の件数を使う。予約システムがGTMやGA4の設置に対応していれば、そちらの機能で入れる |
| 電話が実際につながったかを知る | GTMが見られるのはタップまで | 受付の電話メモの件数と月ごとに突き合わせる |
| 前のページで入れたデータレイヤーの値を次のページで読む | データレイヤーはページごとに消える | 次のページでも入れ直してもらう |
| 画面に出ない値(レッスンの種類、会員かどうか)を組み込み変数で取る | 組み込み変数はページとクリックした要素の情報だけ | 制作会社にデータレイヤーで入れてもらう |
| テーマが変わってもクリック計測が壊れないようにする | Click Classes や Click Text は見た目の変更で変わる | リンク先URL(Click URL)で書くか、data- 属性を付けてもらう |
| 過去にさかのぼって数える | GTMは設定した後の出来事しか送らない | 設定した日を記録しておき、前後で比べない |
データレイヤーの依頼を制作会社が受けられない場合は、サンクスページ型(/thanks/ の表示をページビューのトリガーで数える)で始めます。サンクスページを直接開かれると数え間違えますが、小さな教室の申込件数なら、月に一度フォームの受信メールの件数と比べれば十分に気づけます。
よく詰まるところ
| 症状 | 原因 | 直し方 | ||
|---|---|---|---|---|
| トリガーの条件に Click URL が出てこない | 組み込み変数が有効になっていない | 「変数」→「組み込み変数」の「設定」でチェックを入れる | ||
| カスタム イベントのトリガーが動かない | イベント名の大文字・小文字やつづりが push() とずれている | プレビューモードで実際のイベント名をコピーして貼る | ||
データレイヤー変数が undefined になる | 変数名とキー名がずれている。または値の push() がトリガーのイベントより後 | キー名を合わせる。値は event と同じ push() に入れてもらう | ||
| 前のページの値が残って見える | 同じページ内で同じキーが上書きされずに残っている | 毎回のイベントで同じキーを必ず入れてもらう | ||
dataLayer を入れたら既存のタグが止まった | dataLayer = [...] と代入していて、GTMの値を消した | `window.dataLayer = window.dataLayer | []; と push()` に直してもらう | |
| サンクスページのイベントが他のページでも出る | 含む や正規表現で thanks だけを書いた | ^/thanks/?$ のように先頭と末尾まで書く | ||
| ドメインの正規表現が思わぬURLに当たる | . を何でも1文字として読んでいる | reserve\.example のように \ を付ける | ||
| ボタンをクリックしても条件に当たらない | 中の画像や span がクリックされ、Click Element がそちらになる | .line-btn, .line-btn * のように中の要素も含めるか、リンクのみのトリガーで Click URL を使う | ||
| 例外を付けたのにタグが出る | 配信トリガーと例外でトリガーの種類が違う | 例外のトリガーを配信と同じ種類で作るか、配信トリガーの条件に「一致しない」を足す | ||
| スクロールのイベントが二重になる | GA4の拡張計測機能の90%と、GTMの90%が両方動いている | GTMからは90%を外す | ||
.* のカスタム イベントでタグが何度も出る | GTMが自動で出すイベントにも全部当たっている | 受けたいイベント名を全部書いた正規表現にする | ||
| 変数やトリガーを消せない | どこかのタグやトリガーが使っている | 一覧の使用中の表示から参照元を外してから消す | ||
| GA4でパラメータの値がレポートに出ない | カスタム ディメンションに登録していない | 「管理」→「データの表示」→「カスタム定義」で登録し、24〜48時間待つ |
作ったら、公開する前に必ずプレビューモードで1つずつ確かめます。プレビューの見方は「公開前の確認:GTMのプレビューとGA4のDebugView」に書いています。
次にやること
- GTMの導入と初期設定:コンテナを作ってサイトに入れ、GA4タグを1つ置く(まだコンテナを入れていない場合はここから)
- GTMでボタンのクリックを計測する:電話・LINE追加・資料請求(クリックトリガーとボタン位置のパラメータを、3つのボタンで作る)
- GTMでフォーム送信を計測する:サンクスページ型と送信イベント型(データレイヤーのカスタム イベントを、体験申込フォームで仕上げる)
- 公開前の確認:GTMのプレビューとGA4のDebugView(作ったトリガーと変数が正しく動くかを確かめる)