JavaScript変数やCookieの値に応じてタグの配信を変えるタグマネージャの設定方法（全20回の17）

JavaScript変数をGoogleタグマネージャで利用する

GoogleタグマネージャはJavaScriptで動作するツールなので、JavaScriptとの相性も良く、ほかのJavaScriptで利用している変数も利用できます。例えば、以下のような場合です。

●JavaScript変数を取得する例

• Webページで使用しているJavaScriptの変数の値を利用したい
• ほかのツールで利用しやすいよう、もろもろの情報をJavaScript変数として出力している

JavaScript変数は文字通り変数（状況によって値が変わる要素）ですので、Googleタグマネージャ側で利用するためには、変数として登録する必要があります。難しそうに聞こえるかもしれませんがとても簡単で、5-1のDOM要素変数と同じく、取得したいJavaScriptの変数名を入力するだけで変数登録ができます。

JavaScript変数を登録する

JavaScript変数は、変数の新規登録画面を表示して「変数の選択」で「JavaScript変数」を選択します。あとはわかりやすい「変数名」を入力し、取得したいJavaScript変数の変数名を「グローバル変数名」に入力して保存すれば設定は完了です。例えば、もし商品詳細ページで商品IDを「itemId」というJavaScriptにセットしている場合であれば、「itemId」と入力します。こうすることで、そのページで扱っている商品IDを値として取得することができるようになります。

「変数の選択」で「JavaScript変数」を選択し、取得したいJavaScript変数の変数名を「グローバル変数名」に入力する。

ちなみに、普通のJavaScript変数だけでなく配列も取得することができ、その場合は「配列名」を入力するとその配列全体が、「配列名.インデックス」と入力すると配列のインデックスに入れられた値が取得できます。配列内の特定の箇所を取得する際、通常のJavaScriptのように「配列名[インデックス]」と書いても値を取得できないので、その点は注意してください。例えば「testArray」という配列があった場合、その全体を取得したければ「グローバル変数名」に配列名である「testArray」と入力し、逆に特定の箇所、例えば先頭の値が欲しければ「testArray.0」と記述します。この場合、「testArray[0]」と書くのは誤りとなります。

Cookieにはユーザーの情報が保存されている

Googleタグマネージャは、Cookieの値も参照することができます。Cookieとはブラウザが一般的に持っている機能の1つで、そのWebページを訪れたユーザーが何かしらの値を保存しておける領域になります。5-2で解説したJavaScript変数はWebページを移動すると消えてしまいますが、Cookieは一定期間その値を保存しておくことができます。例えば、以下のように利用されています。

●Cookieが使われる例

• JavaScriptで動作するタグのもろもろの情報を保存する（Googleアナリティクスなど）
• 会員機能があるWebサイトで「ログイン中」という状態を保存する

例えば、「会員ユーザーがログインしている場合「loginStatus」という名前のCookieに値が入る」といった仕様のWebサイトであれば、このCookieの値を参照して中身が入っているかどうかで、そのユーザーがログインしているかどうかを判別できるようになります。

「ファーストパーティCookie」変数を作成する

Cookieの値を取得するには、「ファーストパーティCookie」変数を作成します。ほかの変数と同様こちらも簡単に利用可能で、変数の新規登録画面で「変数の選択」で「ファーストパーティCookie」を選択し、わかりやすい「変数名」を入力して「Cookie名」に値を取得したいCookieの名前を入力して保存すれば、変数の作成は完了です。以下の例では、ログイン中の情報を格納している「loginStatus」というCookieを参照する例です。

「変数の選択」で「ファーストパーティCookie」を選択して、「Cookie名」に値を取得したいCookieの名前を入力する。

変数として登録してしまえば、あとはログイン／ログアウトを判断するようなトリガーの条件として使うもよし、タグの設定の値として使うもよし、自由に利用できます。WebサイトでCookieを利用しているのであれば、開発担当の人に話を聞いてみると、意外な使い道が見つかるかもしれません。例えば、「呼び出されるたびにCookieへ数値を1足していく」といったJavaScriptを商品の購入完了ページで処理していたら、Cookieへ保存された値＝そのユーザーのショッピング回数を計測できるようになります。JavaScriptの知識も必要になりますが、応用範囲が広い機能なので興味があれば調べてみるといいでしょう。