様々なツールのタグを自分で一元管理できるGoogleタグマネージャ。Googleから無料で提供されているサービスです。サイトに訪れるユーザーはどこからやってきたか、ユーザー行動の測定、オンライン広告やソーシャルチャネルの影響力を把握、サイトのテストと改善といったことが可能になります。
今回は以下の内容でお伝えしたいと思います。
- Googleタグマネージャの設置
- ページビューとクリックイベントのタグを作成
- Googleアナリティクスで確認
Googleタグマネージャでイベントを計測する前に、Googleアナリティクスの導入・Googleタグマネージャの登録を済ませてください。
#1.Googleアナリティクスの登録
Googleアナリティクス公式サイト
まずは登録からGoogleアカウントを持っている場合はログインしましょう。
持ってない方は、今すぐ登録です。
必須入力項目を入れてトラッキングIDを取得してください。
登録すると管理画面が見れるので、メニューの管理からプロパティリスト内のトラッキング情報を選びます。
このトラッキンコードがGoogleタグマネージャのタグ設定時に必要になります。
#2.Googleタグマネージャの登録
Googleタグマネージャ公式サイト
まずは登録からGoogleアカウントを持っている場合はログインしましょう。
持ってない方は、今すぐ登録です。
#3.アカウント＆コンテナ作成
アカウントを追加します。
アカウント名（社名など）、コンテナ設定でコンテナ名を入れます。
コンテナとは、タグマネージャを管理する箱と思ってください。コンテナ名にはタグマネージャを設置するWebサイトの名前が良いでしょう。コンテナの使用場所には、webサイトの場合はウェブを選びます。iOS、Androidは、アプリでタグマネージャを使用する際に選択します。AMPはAccelerated Mobile Pagesの略語ですが、説明は割愛します。
#4.タグマネージャを設置
コンテナ作成するとワークスペースができます。この画面からタグやトリガー等を設定することができます。
まず、赤枠のコンテナIDをクリック。
モーダル画面が出るので、Googleタグマネージャを設置するためのコードをコピーし、指定箇所に貼り付けます。上のコードはheadタグ内のなるべく上の方に。quadサイトではtitleタグの下に貼り付けました。
下のコードはbodyタグの直後に貼り付ける。こんな感じ。
Googleタグマネージャを設置できたら、タグ管理をやっていきます。
イベントを計測設定する基本的な流れは、変数＞トリガー＞タグを作成します。
#5.変数の設定
変数は、プログラムの中でデータ（値）を入れておく箱のようなイメージです。
あらかじめ用意されている「組み込み変数」とカスタム設定できる”ユーザー定義変数”という項目があります。
初期設定として、幾つかチェックが入っていると思いますが、今回はクリックイベントの測定もしますので、クリックの項目にもチェックを入れておいてください（全て）。一度登録すればその後設定しなくても大丈夫です。
#6.トリガーの設定
トリガーは、イベントを計測する条件やタイミングを指定するものです。
#7.タグの設定
ここではどんなイベントかを設定します。イベントタグとトリガーをセットにして、配信することでGoogleアナリティクスで計測が開始されます。例としてページビューとリンクイベントのタグを設定しました。
タグタイプにはユニバーサルアナリティクスを選択。トラッキングIDは、アナリティクスを登録した際のIDを入れます。リンクイベントには変数設定で追加チェックした変数も入っています。カテゴリ設定ではクリックしたテキスト要素、アクション設定ではクリックしたURLが取れるようになっています。
#8.公開作業
公開作業は管理画面右上の「公開」というボタンを押します。
##その前に
①データを保存しましょう。
管理画面右上の「バージョンの作成」というボタンを押します。
公開前までの設定したものが、バージョンという形で保存されます。
バージョンは設定更新のたびに追加されていくので、設定のバックアップと思ってもらえば良いです。
②公開前のチェックをしましょう。
管理画面右上の「プレビュー」というボタンを押します。
Googleタグマネージャにはプレビューモードがあり、タグを配信したけど計測できない等のケースを、公開前に防ぐことができます。ブラウザーでサイトを見るとプレビューモードが表示されます。
画面下に「ユニバーサル アナリティクス」と「リンク」のタグが出ています。
ユニバーサル アナリティクスタグはページビューなので、サイトを閲覧していれば出るタグです。
リンクタグはリンクをクリックした場合に出るよう設定しています。
黄色いボタンを押した反応が出ているので、大丈夫そうですね。正常に動いています。
タグが表示されない場合は、設定し見直す必要があります。
###さあ公開しましょう。
#9.ユニバーサルアナリティクスで確認
Googleアナリティクスの管理画面に移ります。メニューのレポートからイベントを選択します。
お！値が取れてますね。
イベントカテゴリ、イベントアクションにも何をクリックしたか、PCで1人（自分ですが）閲覧しているのが分かります。右側にも30秒前にクリックイベントが起きたのが計測できています。
地域ではどこの国で見られているかが分かります。
#10.まとめ
今回は弊社サイトにGoogleタグマネージャの設置を行いました。
一度設定すれば、ソースコードを触らず管理画面でタグを簡単に設定確認できるのはとても便利です。
Googleタグマネージャの全体感が伝わればいいなと思います。