Googleタグマネージャーの「カスタムJavaScript変数」とは? データ計測の可能性を広げる強力なツール

Googleタグマネージャー(GTM)の基本的な操作に慣れてきた方の中には、「もっと詳細なデータを取得したい」「GTMの標準機能だけでは、求めている情報が取れない」と感じたことがある方もいらっしゃるのではないでしょうか? 1例えば、クリックされたバナーの画像ファイル名や、HTML要素に設定されているIDなど、GTMの組み込み変数だけでは取得が難しい情報も存在します。
そうした時に活躍するのが、GTMの「カスタムJavaScript変数」です。この変数は、ウェブサイトからのデータ取得の可能性を大きく広げてくれる、非常に強力な機能です。
「カスタムJavaScript変数」はなぜ必要?
GTMには「Click URL」や「Click Text」といった便利な組み込み変数が多数用意されています。これらは、特定の操作(クリックなど)があった際に、その要素のURLやテキストといった情報を自動で取得してくれるため、非常に手軽に利用できます。
しかし、取得できる情報の種類には限界があります。例えば、以下のような情報は組み込み変数では直接取得できません。
- ユーザーがクリックしたバナー画像のファイル名
- ユーザーがクリックしたHTML要素に設定されている固有のID
- ページ内の特定の場所(例えば、記事の特定のセクションのタイトル)のテキスト
このような、より詳細で特定の情報が必要な場合に、「カスタムJavaScript変数」の出番となります。
JavaScriptの力を借りて、ウェブサイトから情報を取得する
「カスタムJavaScript変数」は、その名の通り、「JavaScript」というプログラミング言語を使って、ウェブサイトから柔軟に情報を受け取ることができる変数です。
JavaScriptは、ウェブブラウザ上で直接動作する唯一の「動的な」プログラミング言語です。これにより、一度表示されたウェブページの内容を、ユーザーの操作や時間の経過に応じて変化させたり、情報を取得したりすることが可能になります。
このJavaScriptの「動的に情報を取得したり操作したりできる」という特性をGTMで活用するのが、カスタムJavaScript変数です。ウェブページ上の様々な情報(画像URL、特定のIDなど)をJavaScriptで取得し、それをGTMの変数として利用できるようになります。その結果、取得したデータをGoogleアナリティクスなどの分析ツールに送信し、より詳細なレポートを作成することが可能になるのです。
カスタムJavaScript変数の基本構造
カスタムJavaScript変数をGTMで設定する際は、JavaScriptのコードを特定の形式で記述します。基本的には、以下のような「関数」の形でコードを記述します。
function() {
// ここに、ウェブサイトから情報を取得するJavaScriptコードを書きます
var myValue = document.querySelector('セレクタ').textContent;
// 最終的にGTMの変数として利用したい値をreturnで返します
return myValue;
}この function() { ... return ... } の中に、ウェブサイトから目的の情報を取得するためのJavaScriptコードを記述します。そして、return で返された値が、GTMの変数として利用できるようになります。
まとめ
カスタムJavaScript変数は、GTMの標準機能だけでは取得が難しい詳細なデータを、JavaScriptの力を借りて取得するための強力な機能です。これにより、ウェブサイトのユーザー行動をこれまで以上に深く理解し、データに基づいた改善施策へと繋げることができます。
少し専門的に聞こえるかもしれませんが、この機能はあなたのデータ分析の幅を大きく広げる可能性を秘めています。ぜひカスタムJavaScript変数を活用して、より解像度の高いデータ分析を目指しましょう。
