ホーム / 6.GA4 /

GTMでURLのパラメータを GA4 のパラメータと値として計測する方法

2026年2月9日月曜日

6.GA4

t f B! P L

GTMでURLのパラメータを GA4 のパラメータと値として計測する方法

JavaScriptの勉強がてら Google タグマネージャーを使い GA4 の計測実装を色々と試してみるシリーズです(不定期)。


URLにパラメータがあるWebサイトって多い

Webサイトを閲覧していると各ページのURLをクセで見てしまうのですが、URL内にパラメータが存在することがまだまだ多いよなぁ、と感じています。

 GA4 ではディメンションの「ページパスとスクリーンクラス」を利用することでURL内のパラメータがない状態のデータとして表示することができますが、パラメータの値を分析で利用したいケースもありますよね。


GA4 探索レポートの「ページパスとスクリーンクラス」と「ページパス + クエリ文字列」ごとの表示回数


そんなときディメンションの「ページパス + クエリ文字列」からデータを成形するのは可能ですがやや面倒です。

そこで Google タグマネージャーのカスタムJavaScriptを使って、 URLの特定パラメータを GA4 の各イベントへのパラメータと値として計測させてみます。


JavaScriptでURL内の特定パラメータの値を取得する

 Google タグマネージャー内で設定したJavaScriptは以下です。どのパラメータでも取得するのではなく"test_setparam"パラメータの値だけを取得するようにします。

function() {
  var paramNameToFind = 'test_setparam'; // 取得したいパラメータ名
  var urlParams = new URLSearchParams(window.location.search);
  if (urlParams.has(paramNameToFind)) {
    return urlParams.get(paramNameToFind);
  }
  return '(not set)';
}

JavaScriptの内容

  • 文字列を抽出したいパラメータの決定

var paramNameToFind = 'test_setparam';


  • WebサイトのURL内で"?"や"&"の後ろ文字列だけを取得

var urlParams = new URLSearchParams(window.location.search);


  • URL内に"paramNameToFind"で指定した文字列があれば、"?"や"&"の後ろ文字列を返す

 if (urlParams.has(paramNameToFind)) {return urlParams.get(paramNameToFind);}  


  • 特定の文字列がURL内に存在しなければ"(not set)"を返す

   return '(not set)';}


GTMで GA4 の計測実装する

  • 変数にカスタムJavaScriptで設定
GTMでURLのパラメータを GA4 のパラメータと値として計測するためのGTM内変数設定


  •  GA4 のイベントにパラメータの値として作成したカスタムJavaScript変数を設定
GTMでURLのパラメータを GA4 のパラメータと値として計測するためのGTM内タグ設定


GA4 での計測実装内容を検証

 Chromeのデベロッパーツールでパケットキャプチャにて検証

GTMでURLのパラメータを GA4 のパラメータと値として計測した際のChromeデベロッパーツールで検証
param_nameに"2026"が計測されています。

  Google タグマネージャーのプレビューモードで確認

GTMでURLのパラメータを GA4 のパラメータと値として計測した際のGTMプレビューモードでの検証
param_nameに"2026"が計測されています。

  GA4 のDebugViewで確認

GTMでURLのパラメータを GA4 のパラメータと値として計測した際の GA4 DebugViewでの検証
param_nameに"2026"が計測されています。

ひとりごと

注意ごとや感じたことを各ひとことで。
  •  GA4 イベント内パラメータの値として計測されるので、値のユニーク種類数が多い場合は高基数ディメンションに注意な
  • カスタムディメンションとして設定すれば分析しやすくなるケースはありそう

QooQ