タグマネージャーって
タグマネージャーとは何かについては、以前、「タグの管理が劇的に楽になる「Yahoo!タグマネージャー」を設定してみた」で説明したとおりですが、タグマネージャーの最大のメリットは、何といっても、複数のタグを1つのタグで管理することができることでしょう。
今回はGoogleタグマネージャとその設定方法について簡単にですが説明いたします。
Yahoo!タグマネージャとGoogleタグマネージャの違い
違いとしてはまず、利用権限が挙げられます。
Yahoo!タグマネージャは、Yahoo(リスティング or YDN)に広告を出稿していることが前提ですが、GoogleタグマネージャはGoogleアカウントがあれば誰にでも利用可能です。
サードパーティ提供のタグへのサポート体制も違いとして挙げられるでしょう。Yahoo!タグマネージャは、動作検証済みのサードパーティ提供のタグカタログが充実しています。一方、Googleタグマネージャは、Google提供のタグ(Adowords、アナリティクスなど)のみ用意されていますが、基本的にはタグそのものを貼り付けて個別に登録する必要があります。
また、タグを呼び出す構造上の違いもあります。Yahoo!タグマネージャはページを登録してページ毎に出力するタグを関連付けるのに対し、Googleタグマネージャはコンテナに直接、タグを呼び出すためのルールを設定することになります。
管理画面を開いてみよう
Googleアカウントがない場合は、作成してログインしましょう。
ログイン後、Googleタグマネージャアカウントを作成する必要があります。通常、企業に1つ作成することになるでしょう。
設定を開始
コンテナの作成
タグを束ねる入れものをGoogleタグマネージャでは「コンテナ」と呼びます。
Yahoo!タグマネージャーの場合は、広告アカウント=サイトと紐づいていたので、最初からこのタグの入れ物にあたるものは用意されていましたが、Googleタグマネージャの場合は、サイトやフォームなど、まとめてタグを管理したい単位毎に、コンテナを新規に作成する必要があります。
最初にこのコンテナを作成しましょう。
コンテナができた後の画面はこちら。
以降の設定の流れは以下のようになります。
まずは、タグの登録です。そして登録したタグを呼び出すためのルール設定。そしてタグ毎にそれを呼び出すためのルールを紐づけ、最後にGoogleタグマネージャスニペットをページに貼りつけることになります。
タグの登録
タグは、呼び出したい個別のタグです。
いくつかの種類があらかじめ用意されています。
EFOタグの場合は「カスタムHTMLタグ」で登録するとよいでしょう。
ルールの登録
登録したタグを呼び出すための条件設定が、ルールです。ルールは様々な方法で指定することができます。マクロという任意の処理(JavaScriptのfunctionで定義)を登録し、その処理が返す値で条件を設定できたりもします。フォームにEFOタグを出力する場合でしたら、URLで判定するのが最も指定しやすい方法でしょう。
ただし、フォームの各ページのURLが変わらない場合は、URL以外のルールを指定する必要があるでしょう。
ルールは、スニペットを貼ったページを表示する際に、全て実行され、個々のルールの判定結果により、タグが出力(Googleタグマネージャでは「送信」という)されます。
タグ毎にルールを紐づける
タグを呼び出すためのルールをタグ毎に設定しましょう。複数のルールを設定する場合は、全てを満たした場合にのみ、そのタグが出力されます。
設定方法は、Googleタグマネージャ管理画面のタグ詳細を開き、画面右側「配信のルール」で登録済みのルールを紐づければOKです。
Googleタグマネージャスニペットをページにはる
スニペットをページに貼りましょう。既存の本番環境ではなく、開発環境のページなどでしたら、タグやルールの設定前にスニペットをページに貼ってしまい、動作確認しながら設定を進めるという方法もありえると思います。
公開にあたって
バージョン作成をして公開する
Googleタグマネージャでは、タグの履歴をバージョンとして管理することができます。例えばこれにより設定を更新して問題が出てしまったときなど、一時的に過去のある時点の内容に設定を戻すことが可能です。
プレビューモードとデバッグモードが便利
Googleタグマネージャにはプレビューモードが用意されています。ルールの検証などでいちいちバージョンを更新したり、公開しなくても、プレビューモードをONにすることでその動作を検証することができます。
プレビューモードをONにして、ログイン中のタグマネージャーを開いたブラウザと同じブラウザでスニペットを貼った設定対象のページを開いてください。設定済みの最新の内容のタグ送信動作を、公開することなく検証できます。
またデバッグモードも用意されています。これはプレビューモード同様にタグマネージャーと同じブラウザで対象ページを開くと、ブラウザの開発者ツールのウィンドウに1つGoogleタグマネージャ用のウィンドウが追加され、登録済みタグ一覧と度のタグが送信されたか(呼び出されたか)が確認できます。これによりDOMをいちいち確認する必要がないので、確認が非常に楽に行えます。
まとめ
いかがだったでしょうか。
例えば、特定の操作をおこなったログをGAで取りたい場合などは特に、Googleタグマネージャを使うことになるでしょう。Yahoo!タグマネージャーとともに設定に慣れておきましょう。
Googleタグマネージャ公式サイト
http://www.google.co.jp/tagmanager/
Googleタグマネージャについて(Google提供のヘルプ)
https://support.google.com/tagmanager/answer/2574305?hl=ja