Googleタグマネージャとは~初心者でも分かる利用方法と導入手順
- 2016年6月13日
- 64,944
2015年卒、2年目ライター。
知っていると得する情報を発信していけるよう、日々精進します！
毎日の業務の中で気になったことを綴っているブログ、Twitterともに毎日更新しています。よろしければそちらもチェックしてみてください。
>> 執筆記事一覧はこちら
この記事は2015年8月8日に公開された記事を再編集したものです。
Webサイトを運営していると、アクセス解析をはじめとする各種ツールの活用は必須となります。
そのため、施策の実施や広告出稿などを行えば管理するツールも必然的に増え、管理が煩雑になっていく問題が起こりやすいです。
管理するツールが増えるほど、計測タグも増えてしまうため、仕様変更などが起こった際は、都度タグを書き直す作業も発生してしまいます。
このような問題を解決してくれるのが、GoogleやYahoo!が提供するタグマネージャーです。
今回は、Googleタグマネージャについて、押さえておくべき情報をまとめました。
Googleタグマネージャとは
Googleタグマネージャ公式サイト
Googleタグマネージャとは、Googleが提供するツールで、様々なツールのタグを一元管理（タグマネージメント）できるのが大きな特徴です。無料で提供されており、誰でも使うことが出来ます。
主な使い方としては、Googleタグマネージャのタグを設置し、Googleタグマネージャの管理画面にGoogleアナリティクスやGoogle AdWordsなど他サイトで発行されたタグを登録すると、HTMLの変更を行わずとも、管理画面内でタグの変更や更新などが可能になります。
今までエンジニアなどの管理者に、都度依頼しなければタグの変更が出来なかったというケースはよくあります。
しかし、Googleタグマネージャを使えば、HTMLの変更が必要ないのでエンジニアに頼まずにタグの設置などが可能になります。
Yahoo!タグマネージャとの違い
タグマネージャーといえば、Google以外にもYahooタグマネージャーというものがあります。これらの違いは何があるのでしょうか。
- 導入の手軽さにほぼ違いはなし
- 管理のしやすさもほぼ違いはなし
- 対応しているタグの種類はYahooが多い
対応しているタグの種類はYahooが多い
GoogleタグマネージャとYahooタグマネージャーでは、対応しているタグテンプレートの数に違いがあります。
Yahooは国内外120種類のタグに対応していますが、Googleの場合は19種類です。
※参考：機能と特長 - Yahoo!タグマネージャー
※参考：タグ - Tag Manager ヘルプ
しかし、GoogleタグマネージャはGoogle系のサービスのタグに対応しています。YahooタグマネージャーはGoogle系のサービスへの対応が出来ていない部分があります。例えば、Googleアナリティクスをタグマネージャーで管理する等の場合は、Googleタグマネージャを使わなければいけません。
Googleタグマネージャの機能や特徴など
ではGoogleタグマネージャを導入するメリットとしては何があるのでしょうか。大きく分けて次の4つが挙げられます。
それぞれ見ていきましょう。
バージョン管理がある
Googleタグマネージャではバージョン管理をすることができます。バージョンとは、いつ更新されたか、何番目に公開されたかを示すものです。
この機能があることで、例えば現在公開中のバージョンになにかトラブルが起きた際、トラブル前の状態にすぐに戻すことができます。
また、バージョンを更新する際は、自動的にひとつ前のバージョンが複製され、途中で編集を止めても続きから編集することが可能です。
タグの設置が容易になる
Googleタグマネージャを使うと、タグの設置が容易になります。
今までサービスごとに発行されたタグは、それぞれウェブサイトのソースの中に書いていく必要がありました。しかし、Googleタグマネージャを使うと、タグマネージャ管理画面に入力して保存すればサイトのソースに反映されます。
都度、サイト管理者に設置を依頼する必要がなくなるのです。
公開前にテストができる
設定内容の動作確認用の機能として、プレビューモードがあります。
これは、Webサイト上で設定内容が正しく配信されているか確認することができる機能です。
正しく動作している場合はそのまま公開モードに変更すると、実際のWebサイト上に反映されます。
タグ管理ができる
タグ設置が増えてくると、どのタグがどのページに埋め込まれているのか分からなくなります。タグの設置漏れなども往々にして発生してしまいます。
しかし、Googleタグマネージャを使うと、一斉に設置できたり、どのサービスのタグを埋め込んでいるのかもわかりやすくなるので管理ができるようになります。
Googleタグマネージャの設置方法
今回はGoogleタグマネージャを使って、Googleアナリティクスのタグを設置してみます。
1. Googleタグマネージャのアカウント登録をしタグを発行
まずは、Googleタグマネージャの公式サイトでアカウントを作成します。
※参考：Googleタグマネージャ公式サイト
そこで、Googleタグマネージャ用タグを発行してくれます。このタグをサイトの全ページに貼り付けます。body開始ダクの直後に設置します。
2.コンテナを作成し、Googleアナリティクスをコンテナに登録
Googleタグマネージャ画面に移り、タグを発行します。このとき、ユニバーサルアナリティクスを選んでください。
最新版のGoogleアナリティクスはユニバーサルアナリティクスといいます。
配信ルールとは、どういうタイミングでタグを動かすのか、という条件設定です。
上図ではすべてのページで動かすというルール（条件）にしています。他には、購入完了ページならば広告用のタグを発行する、など、さまざまな設定や追加が可能です。
3.タグの公開
コンテナが完成したら、タグを公開します。
これをしないと、タグが機能しませんので注意してください。
4.Googleアナリティクスで確認
タグを公開しましたら、Googleアナリティクスのリアルタイム解析で確認します。
自分でアクセスしグラフが連動しましたらOKです。反応しなければ、タグの貼り付けや、「公開」の押し忘れをチェックしましょう。
Googleタグマネージャの新UI（ユーザーインターフェース）への移行
Googleタグマネージャは、これまで英語版のみの提供でしたが2015年1月中旬に日本語化されました。3月末の本格的な移行を経て、6月1日より強制的に新UIへの移行が実施されました。
この日本語対応によって大幅に使いやすさが向上し、導入のハードルも下がったと言えるのではないでしょうか。
変更点としては大小様々な変更もありますが、特筆すべきは以下の3点です。
1.管理画面のデザインの変更
以前のUIでは、バージョン管理がサイドメニューに表示されていましたが、ヘッダーに移動しています。
最近のアクティビティが表示されるようになり、直近でどのような更新が行われたのかを把握しやすくなりました。
また、メイン画面となる右カラムの上部には、現在使用しているタグをまとめたコンテナの状況を示す情報が並んでいます。下半分には、コンテナ内の編集履歴が表示されています。
この変更により、複数人でコンテナの編集(タグの編集)をする際に、一覧をすぐに見ることができるようになりました。
代わりに登録済みのタグの一覧がサマリー画面上に表示されなくなっているので、確認したい場合は左メニューをクリックして、一覧画面を表示させる必要があります。
他にも、旧UIでは折りたたみ型の展開メニューから、登録済みのタグの詳細を直接開くことが可能でしたが、新UIでは一覧画面への動線のみとなりました。そのため、それぞれのタグの詳細画面を見たい時は、一覧画面を表示した後、目的のタグをクリックすると詳細が表示されます。
新UIは、Googleアナリティクスとほぼ同一のデザインとなったので、操作感に統一性があり、Googleアナリティクスの利用者なら感覚的に操作できるでしょう。
2.名称の変更
一部用語の名称の変更も実施されています。
変更前：ルール
変更後：トリガー
変更前：マクロ
変更後：変数
名称に変更があったのみで、内容に変更はありません。変数については、一覧画面のUIに変更がありましたが、よく利用される主な変数はチェックを入れるだけで利用可能になったので、より使用しやすくなりました。
3.作成フローの変更
タグやトリガー、変数などの作成フローが旧UIでは、1画面上で全ての行程を行う必要がありましたが、ステップに沿って設定するフローに変更になりました。
まとめ
今回は、Googleタグマネージャについて、担当者以外でも知っておきたい概要をまとめました。
Googleの各種サービスを利用している、利用したいならGoogleタグマネージャーを選択することをオススメします。
制作担当者が普段、どのような業務をしているのか、概要が分かるだけでも同じ言語で話すことができるので、作業効率は格段に上がります。
また、タグマネージャーの設置はアクセス解析やユーザー分析などが可能になるため、マーケティングにおいても重要です。
Yahoo!タグマネージャーについての記事も、合わせて読むことをオススメします。
Yahoo!タグマネージャーについて
このニュースを読んだあなたにオススメ
Googleタグマネージャの運用
ホームページ制作初心者のためのHTMLタグの基礎知識・書き方がわかる記事5選
従来のやり方ではNG？タイトルタグ、キーワード、ディスクリプションについての解説
このニュースに関連するカリキュラム
