Googleタグマネージャーを導入するメリット

Googleタグマネージャを導入するメリットとしては何があるのでしょうか。大きく分けて次の4つが挙げられます。

  • バージョン管理ができる
  • タグの設置が容易になる
  • 公開前にプレビューできる
  • タグ管理が容易になる

それぞれ見ていきましょう。

1.バージョン管理ができる

Googleタグマネージャではバージョン管理ができます。バージョンとは、いつ更新されたか、何番目に公開されたかを示すものです。この機能があることで、現在公開中のバージョンになにかトラブルが起きた際、トラブル前の状態にすぐに戻せます。

Googleタグマネージャで新しく変更を加えると、自動的に新しいバージョンが作成され、途中で編集を止めても続きから編集することが可能です。

2.タグの設置が容易になる

前述したとおり、Googleタグマネージャを使うと、管理者や開発担当者に依頼することなく自分でタグをソースに埋め込めます。

今までサービスごとに発行されたタグは、それぞれページのソースコードの中に書いていく必要がありました。しかしGoogleタグマネージャを使うと、タグマネージャ管理画面に入力して保存すればページのソースに反映されます。

3.公開前にプレビューができる

設定内容の動作確認用の機能として、プレビューモードがあります。これは、ページで設定内容が正しく配信されているか確認できる機能です。正しく動作している場合はそのまま公開ボタンを押すと、実際のページに反映されます。

4.タグ管理が容易になる

タグ設置が増えてくると、どのタグがどのページに埋め込まれているのか分からなくなります。また、タグの設置漏れなども発生してしまいます。

しかし、Googleタグマネージャを使うと、全てのページに一気に設置できたり、どのタグを埋め込んでいるのかもわかりやすく管理できます。

Googleタグマネージャー(GTM)の使い方

ここではGoogleタグマネージャーを使って、Googleアナリティクスのタグを設置してみます。

1.アカウントの設定

まずは、アカウントの設定方法について具体的に画像を交えて紹介していきます。これからタグマネージャーを導入しようと考えている方は、ぜひ参考にしてみてください。

Googleタグマネージャー(GTM)にログインする

Googleタグマネージャ公式サイトの画面右上にある「Sign in for Tag Manager」を選択します。

新しいアカウントを作成する

image2.jpg

Googleタグマネージャを始めるには、アカウントを作成する必要があります。アカウント名はあとからでも変更ができるので、分かりやすい名前を付けておきましょう。入力が終わったら続行を選択します。

コンテナを設定する

image14.jpg

アカウントの設定が終わると、コンテナの設定に移ります。コンテナとは、Googleタグマネージャにおける管理の箱を意味します。コンテナを設置すれば、その中で自由にタグの出し入れが可能になります。

分かりやすいコンテナ名を入力し、コンテナの使用場所を選択します。Webサイトに設置したいので、「ウェブ」を選択します。「iOS」と「Android」はアプリ用、「AMP」はAMPページ用になります。作成を押すと、利用規約が表示されるので同意すると次の画面へ移動します。

タグを取得し、ページに埋め込む

image12.jpg

表示されたコードを、ページに全て指示どおり埋め込むとGoogleタグマネージャが使えるようになります。

2.Googleアナリティクスのタグの追加

アカウントの作成が完了したら、次は実際にタグの設定です。ツールを上手に使うための基本事項となっているので、1つ1つ確認していってください。前項と同様に画像を活用して説明しているので、役立ててもらえれば幸いです。

コンテナにタグを追加する

image6.jpg

ワークスペース>新しいタグを追加 を選択すると、下記画面が表示されます。

image8.jpg

赤枠の部分に分かりやすいタグ名を付け、タグの設定と、そのタグが発動する条件(トリガー)を設定します。

image5.jpg

トラッキングタイプは「ページビュー」、Google アナリティクス設定はデフォルトのまま、「このタグでオーバーライド設定を有効にする」にチェックをつけます。トラッキングIDを入力するフィールドが表示されますので、そこにGoogle アナリティクスのトラッキングIDを入力します。

トラッキングIDはGoogle アナリティクスの管理画面から確認できる「UA-」から始まるIDです。

image10.png

Google アナリティクスの「管理」から該当のプロパティを選択し、「トラッキング情報> トラッキングコード」に「UA-」のIDが表示されています。

次にトリガーを設定します。

image9.jpg

上記で設定したタグが発動する条件(トリガー)を設定します。トリガーをクリックするとトリガーの選択画面が表示されますので、「All Pages」を選択します。

これでタグの設定は完了です。

3.タグを公開する

タグの設定ができたら実際にタグを公開していきます。より実践的な内容となっているので、最後まで確実に習得しましょう。ここまで完璧になれば、タグマネージャーを問題なく活用できます。

プレビューモードで正しく実装されている確認する

image11.jpg

画面右上の「プレビュー」を選択すると、「プレビューモード」が始まり、画面中央にオレンジの枠が表示されます。

image1.jpg

この状態で、タグを埋め込んだ実際のページへアクセスすると、画面下にGoogleタグマネージャのプレビューモードが表示されます。発動していれば「Tags Fired On This Page」に該当のタグが表示されます。

このページでは、「FB - Pixel Tag」と「GA - Tracking Tag」が発動していることがわかります。

プレビューモードは、Googleタグマネージャを開いているブラウザ上でページにアクセスした時のみ表示されます。

タグを公開する

image4.jpg

発動していることを確認したら、管理画面に戻り、プレビューモードを終了し、公開ボタンを押すことで実際のページタグが反映されます。

Googleアナリティクスでアクセスを確認する

image7.jpg

タグを公開したら、Googleアナリティクスのリアルタイム解析で確認します。
タグを埋め込んだページに自分でアクセスし、グラフが動いていれば問題ありません。