GTMでURL内の複数パラメータから特定パラメータをイベント内のパラメータ値として計測する方法-thread the needle !!

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

URLに複数パラメータがあるWebサイトも多い

WebサイトでURL内に1つのパラメータだけでなく、複数のパラメータが存在するのをよく見かけます。Webサイトを閲覧するユーザーに対するコンテンツの制御などでパラメータを使うというケースが多いかと思いますが、パラメータが含まれる長いURLを見るとつい「何の制御かな？」って考えてしまいますね。

GA4 ではディメンションの「ページパスとスクリーンクラス」を利用することでURL内のパラメータがない状態のデータとして表示することができます。

ただ、特定のパラメータの値をイベント内のパラメータにセットしてデータ集計したいというケースもあるかもしれません。

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

前回は指定のパラメータ値を取得しましたが、今回は優先順位が追加されています。

https://blog.muraweb.net/2026/02/measure-url-single-parameter-ga4-gtm.html

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

Google タグマネージャー内で設定したJavaScriptは以下です。どのパラメータでも取得するのではなく複数のパラメータを優先順位順にチェックし、最初に見つかったパラメータ値を1つだけ返します。

function() {
  var urlParams = new URLSearchParams(window.location.search);
  var priorityList = ['testparams1', 'testparams2', 'testparams3'];

  for (var i = 0; i < priorityList.length; i++) {
    var value = urlParams.get(priorityList[i]);

    if (value) {
      return value;
    }
  }

  return '(not set)';
}

JavaScriptの内容

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

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

文字列を抽出したいパラメータを「優先順位順」のリストとして決定

var priorityList = ['testparams1', 'testparams2', 'testparams3'];

リストの先頭から順番に、各パラメータ名の値を取り出す（リストの個数だけ繰り返す）

for (var i = 0; i < priorityList.length; i++) {

var value = urlParams.get(priorityList[i]);

値が存在すれば（空でなければ）その値を返し、その時点でループを終了する

if (value) {return value;}

リスト内のどのパラメータもURLに存在しなければ"(not set)"を返す

return '(not set)';}

GTMで GA4 の計測実装する

変数にカスタムJavaScriptで設定

GTMでURL内の複数パラメータから特定パラメータをイベント内のパラメータ値として計測する変数設定

GA4 のイベントにパラメータの値として作成したカスタムJavaScript変数を設定

GTMでURL内の複数パラメータから特定パラメータをイベント内のパラメータ値として計測するタグ設定

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

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

GTMでURL内の複数パラメータから特定パラメータをイベント内のパラメータ値として計測した後のChromeデベロッパーツールでの確認

GA4イベント内における dl パラメータの値にて検証したURLが確認できます。

パラメータとして下記で検証してみました。

testparams1=football

testparams2=blue

testparams3=morning

複数のパラメータ内で優先順位として、testparams1 > testparams2 > testparams3 として設定していたので、

ep.params_names パラメータの値には football が計測されています。

なお、testparams1を除いた状態では下記となります。

GTMでURL内の複数パラメータから特定パラメータをイベント内のパラメータ値として計測した後のChromeデベロッパーツールでの確認2回目

複数のパラメータ内での優先順位として、testparams1 > testparams2 > testparams3 ですが、testparams1 が存在しないため、testparams2 がデータとして計測されています。

そのため、ep.params_names パラメータの値には blue が計測されています。

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

GTMでURL内の複数パラメータから特定パラメータをイベント内のパラメータ値として計測した後のGTMプレビューモードでの確認

こちらも Google Chrome でのデベロッパーツールでの検証と同様の結果が確認できました。

ひとりごと

注意ごとや感じたことを各ひとことで。

当然ながらWebサイト内でパラメータの順序が逆でもコンテンツが表示される場合は、このJavaScriptではうまく計測できないから注意な。そもそもそんなWebサイトの仕様はSEOにも良くないことが多いのでやめよう。
複数のパラメータでコンテンツ制御している時に1つめのパラメータでのコントロール条件を計測したい場合は活用できそうだがケースは限られそう

GTMでURL内の複数パラメータから特定パラメータをイベント内のパラメータ値として計測する方法