Date: 2018/10/22

2018年度版 Google タグマネージャでアナリティクスを設定する方法

こんにちは、後藤です。先日、Googleタグマネージャを使ってイベントトラッキングを測定できるように設定したんですが、管理画面がだいぶ変わっていて少し戸惑ってしまったので、今回は、その時の設定手順とアナリティクスの目標設定まで、忘備録として記事に書き留めたいと思います。

※思ったより長くなってしまったので、今回はアナリティクスの設定までとなっています。

では早速、Google タグマネージャの簡単な説明から。

はじめに、Google タグマネージャとは

「Google タグマネージャ」とは、Googleアナリティクスようなアクセス解析のタグや、AdWordsなどの広告で使われるタグを1つのタグで一元管理するツールです。
ここで言うタグはHTMLタグのことではなく、「コンバージョンタグ」や「トラッキングコード」のような解析タグのことを指します。
また、あらかじめページにタグマネージャのコードさえ埋め込んでおけば、新しくタグを追加するときもHTMLに追記することなく、管理画面からタグの追加や削除といった操作ができるようになります。

Google タグマネージャを導入してみよう

タグをまとめて管理するためには、まずタグマネージャのコードをサイト内に設置しなくてはなりません。すでに何らかのタグがサイト内に設置されている場合は、一旦そのタグを外したあとタグマネージャで設定し直す必要があるので注意してください。では、実際にGoogleタグマネージャを使って、どうやって導入・設定するのか下記で説明していきます。

タグマネージャーの事前準備

GTM_01

Googleタグマネージャを利用するにあたってアカウントを開設する必要があります。
下記のURLにアクセスしたのち「今すぐ登録」を押してください。

※GoogleタグマネージャはGoogleアカウントが必要なので、
アカウントをお持ちじゃない方は、事前にGoogleアカウントを作成しておいてください。

Google タグマネージャ

1.アカウントを作成する

登録の次はアカウントを作成します。

GTM_02

アカウント名 – 企業名(任意)
– 日本
Google や他の人と匿名でデータを共有 – (任意)

アカウント名を決める時にこれといった決まりやルールはないですが、アカウントが増えても散らからないように管理しやすい名前にした方がいいと思います。私の場合、企業名に設定することが多いです。

「Google や他の人と匿名でデータを共有」にチェック入れると、ベンチマークサービスを利用できるようになり、匿名でデータを共有する代わりに他サイトのデータと比較できるようになります。

2.コンテナの設定する

アカウントの次は、コンテナの設定です。

GTM_03

コンテナ名 – サイトURL(任意)
コンテナの使用場所 – ウェブ

タグマネージャーのコンテナとは管理する上の単位みたいなものと思ってください。
①で作成したアカウント内で新しくサイトが増えて別で管理したい場合はコンテナを追加して作成することなります。「1サイト = 1コンテナ」と思って大丈夫です。
私の場合は、ドメインで管理していますが、アカウント名と同じくコンテナ名もとくに規則はないので、ご自身で管理しやすい名前を入力してください。

コンテナの使用場所は、今回はサイトになるので「ウェブ」とします。

3.タグマネージャをインストール

GTM_04

利用規約に同意すると画像のようにポップアップでコード(スニペット)が表示されます。
タグマネージャでは、このコードをサイトに設置することで一元管理が出来るようになります。
画像にもあるように、headタグの中とbodyタグ開始直後の2箇所に設置出来たら準備完了です。

4.タグマネージャでタグを作成する

GTM_05

4-1.タグの名前を設定する

「ワークスペース」のタブから「新しいタグを追加」をクリックしてください。

GTM_06

すると右からパネルがスライドされて画像のような画面が表示されると思います。
「タグの設定」と「トリガー」をそれぞれ設定することでタグマネージャの導入は完了です。
まずは、あとで見たときに何のタグかわかるように、「名前のないタグ」と表記されている欄にわかりやすい名前を入力しましょう。

4-2.タグを選択して設定する

GTM_07


名前の入力が出来たら、アナリティクスのタグを設定します。
タグの設定をクリックすると、タグタイプを選択するメニューが表示されるので、
メニューから「Google アナリティクス – ユニバーサル アナリティクス」を選択します。

GTM_08

「トラッキングタイプ」はページビューを選択して、「Google アナリティクス設定」の項目には新しい変数を作成しましょう。プルダウンで表示されている「新しい変数…」を選択すると下の画像ように表示されます。

GTM_09

4-3.変数の設定画面で変数を作成

「新しい変数…」を選択すると変数を設定する画面が表示されます。

GTM_10

トラッキングIDには、対象のGoogleアナリティクスの画面からトラッキングIDをコピーして入力してください。入力が出来たらわかりやすい変数名を入れておきましょう。

※Googleアナリティクスで設定が済んでいない方は、事前に取得しておいてください。

4-4.トリガーを設定する

GTM_11

タグの設定が終わったら次はトリガーの設定です。トリガーでは、設定したタグを実行するタイミングを条件で設定します。 今回はすべてのページが表示されたタイミングで実行して欲しいので「All page」を選択します。

GTM_12


以上でGoogleアナリティクスのタグの設定は終わりです。

GTM_13

作成したタグの動作テストをする

GTM_14

動作テストをするには一度「ワークスペース」に戻り、画面右上の「プレビュー」をクリックしてください。すると、オレンジ色の背景で「プレビュー中のワークスペース」と出るので、表示が確認できたらテスト実行中となります。

では、そのままサイトを表示してみましょう。ブラウザの画面下にタグマネージャのテスト画面が表示されていると思います。「Tags Fired On This Page」と表記されている箇所は、実行されたタグを表します。つまり、今回作成した「Google アナリティクス」のタグがそこに表示されていたら正常に動作していることになります。

GTM_16

作成したタグを公開する

正常に動作していることが確認出来たら、タグマネージャの管理に戻って画面右上の「公開」ボタンをクリックします。公開したタグが何かわかるように、「バージョン名」「バージョンの説明」に入力出来たら公開してください。公開後は、Googleアナリティクスの画面の「Googleアナリティクス > リアルタイム」からアクセスがカウントされているかチェックを行いましょう。

さいごに

当初は、タグマネージャでイベントトラッキングを設定して、アナリティクスの目標設定まで書こうと思っていたんですが、思いのほか長くなってしまったので、今回はGoogleタグマネージャーのGoogleアナリティクスの設定までにとどめておきます。次回は、イベントトラッキングの設定方法をご紹介したいと思います。

後藤

この記事を書いた人

こっそりフォローが上手なWeb開発部長。人に合う色や形を探すのが好き。美容師として6年間働くも、グラフィックデザインに興味を持ちはじめる。友人の紹介で谷川と会うも「今更グラフィックは無理」とこけおどされる。その悔しさをバネに独学でWebを勉強し、やがて谷川と仕事をするようになる。徐々に信頼関係が確立されてゆき、AND SPACEに入社。丁寧な仕事と、キレイなソースを書くことに定評あり。