サイトの運用にいろいろと便利なGoogle Tag Manager(GTM)。
使ってみたいけど、設定が面倒なのでは、と思っていませんか？？
実はとても簡単に設定ができます。
GTMは頻繁にUIが変更されているらしく、少し前の記事だと手順通りにやろうとすると、ちょっとしたところで躓くことがあります。
それが、難しいと感じる理由になっているかもしれないですね。
この記事の手順は2018年8月19日現在のものになります。
新しく設定をしたいと思っている人の助けになれるといいなと思っています。
GTMって何ができるの？？
GTMって便利みたいだけど、何ができるんだろう？？
Google Tag Managerは、サイトに設定するタグを一元管理できるツールです。
例えば・・・
- GoogleAnalyticsのコード
- コンバージョンのタグ
- リンク計測、リターゲティング計測タグ
などなど・・・
いろいろなタグを一挙に管理することができます。
ソースコードに直に書くと、追加や修正があったときに、いちいちソースを修正しないといけないですが、GTMはブラウザで管理画面を開いてそこから追加、修正、削除ができます。
なので、htmlファイルを編集するのが苦手な人でも簡単に使えるところが利点です。
また、JavaScriptも登録できるので、オリジナルの計測タグを作成することもできます。
※ちなみに、無償です！
前提条件
誰でも使えるけど、条件はあるよね？？
次の条件を満たしているものとして話を進めます。
- Googleのアカウントを持っている。
以上。
自分のGoogleアカウントとサイトを紐づけるのが嫌であれば、この際サイト用のGoogleアカウントを作成してもいいかもしれないですね。
アカウントの新規作成〜該当サイトへの適用まで
Google Tag Managerにアクセス
URLはこちら
“https://tagmanager.google.com/?#/home”
ログインすると、このような画面が表示されます。
Googleにログインしていない場合はこちらの画面になるのでログインすると、上記の画面になります。
アカウントの新規作成
1）アカウントの設定
アカウント名と国を指定します。
「Google や他の人と匿名でデータを共有」のチェックボックスは、このチェックボックスをONにすると、Googleのベンチマークレポートが使えます。
ベンチマークというのは、競合他社や自分と同じような規模のサイトのアクセス数などの比較が閲覧できるサービスです。
比較できるのは便利だと思いますが、自分のサイトの情報も他者に見られることになるので、そこが了承できるならチェックをつけても良いと思います。
入力したら、「続行」ボタンをクリックします。
2）コンテナの設定
コンテナ名に自分のサイトのURLを入力します。
コンテナの使用場所は、サイトの場合はウェブを選択します。
全部入力が終わったら「作成」ボタンを押します。
Google タグマネージャ利用規約
「作成」ボタンを押すと「Google タグマネージャ利用規約」が出てきます。
日本語がないので、その他の言語で読むしかないのですが、内容がきになる方はこちらに日本語のページがあるので確認してみてくあださい。
問題がなければ「はい」を押します。
Googleタグマネージャーのコード
「はい」を押してしばらくすると、タグマネージャーのダッシュボード画面になり、「Google タグマネージャをインストール」のポップアップ画面が表示されます。
これを、指定通りにページのheadタグとbodyタグにそれぞれ貼り付けます。
これで、サイトでタグマネージャーが使用できるようになります。
以上が、GTMの登録〜ページへの設定になります。
設定しただけでは、タグが何も登録されていないので、この時点ではGTMは何もしていません。
ただ存在するだけです。
GTMの設定ができた！何か登録してみたいな〜
Google AnalyticsIDの設定をしてみよう！
まずは、基本的なGoogle Analyticsコードの設定から。
順番としては「変数」→「タグ」で設定を行っていきます。
変数の設定
ユーザー定義変数の「新規」ボタンをクリックします。
名前を入力します。
何でもいいですが、今回は「トラッキングID」としました。
名前をつけたら、右上にある鉛筆マーク（編集リンク）をクリックします。
変数の種類から「Google アナリティクス設定」を選択します。
選択すると、Googleアナリティクスを設定する欄が表示されます。
Googleアナリティクスのトラッキングコードを設定します。
CookieドメインはデフォルトのAutoのままでOKです。
タグの設定
タグを開き、新規ボタンをクリックします。
任意の名前を設定します。
今回は「トラッキングタグ」としました。
右上の鉛筆マーク（編集リンク）をクリックします。
タグタイプで「 Google アナリティクス – ユニバーサル アナリティクス」を選択します。
トラッキング タイプは「ページビュー」
Google アナリティクス設定は、プルダウンから先程作成した「変数」の名前を選択します。
（手順どおりの設定であれば「{{トラッキングID}}」
トリガの鉛筆マークをクリックします。
トリガーの選択から、「All Pages」を選択します。
※これは、「GTMタグが設定されているすべてのページに適用する」という意味になります。
以上で登録は終了です。
これで、アナリティクスのコードが設定できました。
ちゃんと設定できたか確認しよう〜
GTMは、公開するまえに確認することができます。
ここでちゃんと設定されているか確認しましょう。
プレビューモードにする
画面の右上に「プレビュー」ボタンがあるので、それをクリックするだけです。
画面がプレビュー中になればOKです。
実際にサイトで確認する
該当するサイトを開く
該当するサイトを開くときの注意としては、簡単に言うと、同じセッションのブラウザで開いてください。
実際に何をすればよいかというと、
GTMを開いているブラウザ（chromeならchrome）で、別のタブを開いてそこでサイトを開いてください。
確認方法
左側の「Page View」 クリックすると、右側の「Tags Fired On This Event」という箇所に「トラッキングタグ」というボタンが出てきていれば、トラッキングタグの読み込みがされています。
トラッキングタグのボタンをクリックすると、内容の詳細が確認できます。
アナリティクスコードが正しく読み込まれているかどうかを確認しましょう。
GTMの公開！
GTMの管理画面に戻り、プレビューを終了します。
そして、「公開」ボタンをクリックします。
バージョン名は、任意です。あとで何をして公開したのかがわかるような名前をつけましょう。
今回は初回だったので、「GTM設定」としました。
これで、一連の流れは完了です。GTMが設定されました。
まとめ
GTM、意外と簡単だったと思います。
GTMがあると、管理系の整理が楽になるので本当におすすめです。
なお、このページに作成した画面ショット、手順は、2018年8月19日現在のものになります。
GTMの画面や設定手順はよく変わるみたいで、2年前の記事だと書いてある手順通りに行かなかったりします。
なるべく現時点で新しい記事を参考にして設定することをオススメします★
こちらもあわせてどうぞ〜
