Googleタグマネージャ(GTM)完全マニュアル~タグマネージャの概要から設定まで~

近年のウェブマーケティングに欠かせない存在となっている「タグ」。

例えば、サイトのアクセス状況を把握するためのGoogle アナリティクスタグや、広告用の媒体タグなど、マーケティング施策の実施や効果測定のためには様々なタグを活用していく必要があります。しかし、複数のタグを1つ1つサイトに設置して管理するのは大変と感じている方も多いのではないでしょうか。

そこで、おすすめするのがタグマネージャです。タグマネージャを簡単に説明すると「複数のタグを一元管理できるツール」のことです。

この記事では、タグマネージャの概要から実際の設定までを説明します。

設定の部分では、皆さんに馴染みのあるGoogleアナリティクス用のタグをGoogle タグマネージャ(GTM)で設定する方法を紹介します。

タグマネージャについてもっと詳しく知りたいという方は↓こちらの記事もお読みください。

理解を深める!タグマネジメントの心得と管理ツールの仕組み

タグマネージャとは?

改めて、タグマネージャをひと言でいうなら「複数のタグを一元管理できるツール」です。もう少し具体的に説明すると、タグマネージャ用の「共通タグ」をページごとに記述するのみ。あとは、タグマネージャの管理画面上で各種動かしたいタグを管理します。

タグマネージャ導入のメリット

タグマネージャの導入によるメリットは大きく3点あります。

●タグ管理が楽になる

複数のタグを導入していると、どのタグが何のタグで、何のために設置しているのかわからなくなります。導入した本人がわかっていても、引き継ぎが発生した場合、後継者が1から理解するのは大変です。そんなときタグマネージャを使用していれば、設置されているタグはタグマネージャの管理画面から一目瞭然になるので、管理が非常に楽になります。

●タグ追加や編集のたびにHTMLを編集する必要がない

実際のHTMLには「共通タグ」のみ※を埋め、動かすタグは管理画面上で設定するので、タグを追加・編集するたびにソースを編集する必要がありません。つまり、いちいちソースを編集しアップロードする手間がなくなります!

※動的に値を取得するタグは、タグマネージャだけでは完結しづらく、HTMLを編集しなければならない可能性があります。

●ページ表示速度が速くなる

 タグは通常HTMLの記述順に読み込まれるため、タグを複数サイトに設置しているとタグの読み込みに時間がかかりページ表示速度が遅くなることがあります。また、1つのタグで不具合が発生すると、その下に設置したタグも動かなくなるといった危険があります。タグマネージャなら、こんな問題も解決できます。タグマネージャを導入すると、HTML上にあるタグは1つなので、表示速度が速くなります。また、あるタグの不具合のせいで、他のタグが動かなくなる問題は発生しません。

では、逆にデメリットはあるのでしょうか?

敢えて挙げるとすると、設置しているタグが少なく、今後も編集や追加の予定がないという方には、タグを導入するメリットはないと言えます。少なくともタグ導入時には「HTML上の既存タグを共通タグに書き換え」→「タグマネージャの管理画面で既存タグの設定」という作業が発生するので、その手間を考えると現在のままの方が(タグマネージャを導入しなくても)よい可能性があります。

どのタグマネージャを導入すればいいの?「Googleタグマネージャ(GTM)」「Yahoo!タグマネージャー(YTM)」を比較!

タグマネージメントツールは、いくつかの企業から提供されています。その中で、よく使われているのは「Googleタグマネージャ(GTM)」と「Yahoo!タグマネージャー(YTM)」です。この2つを簡単に比較してみました。

比較1:テンプレートタグの数

Googleタグマネージャ<Yahoo!タグマネージャー

GoogleタグマネージャではGoogleサービスであるGoogleアナリティクスやGoogle Adsのタグがテンプレートで用意されていますが、その数は限られています。一方、Yahoo!タグマネージャーはYahooだけでなく国内外ベンダのタグが約120種類※用意されています。※2017年11月現在

比較2:情報の多さ

Googleタグマネージャ>Yahoo!タグマネージャー

GoogleタグマネージャはGoogle公式のヘルプページやユーザフォーラムがありますが、Yahoo!タグマネージャーはヘルプページがない(サポートは有償)ので、Googleタグマネージャのほうが導入のハードルは低いといえそうです。

比較3:利用開始の手軽さ

Googleタグマネージャ>Yahoo!タグマネージャー

Yahoo!タグマネージャーにはYahoo! JAPANビジネスIDが必要ですが、GoogleタグマネージャはGoogleアカウントさえあれば誰でも始めることができます。

ここで、簡単に比較しましたが、結局のところどっちがいいの?と思われている方も多いはずです。その答えは、

★Yahoo!広告やその他広告タグ → Yahoo!タグマネージャー

★Googleサービスのタグ → Googleタグマネージャ

です。Yahoo!のタグもGoogleのタグも両方使っているんだけど…という方には、どちらも実装されることを推奨します。 Googleの提供しているサービスのタグはGoogleタグマネージャで、それ以外のサービスのタグはYahoo!タグマネージャーで管理するのがおすすめです。もちろんGoogleアナリティクスはYahoo!タグマネージャーではなくGoogleタグマネージャでの設定が望ましいです。

Googleタグマネージャ(GTM)の導入方法

では、ここからGoogle タグマネージャの設定方法を説明していきましょう。まずは、Google タグマネージャのアカウントづくりから始めます。

下記ページからアカウントを作成し、ログインします。

https://www.google.com/intl/ja/analytics/tag-manager/

次に、アカウント名とコンテナ名を記入してください。詳細は後述しますが、Googleタグマネージャは「アカウント」の中に「コンテナ」という、タグを管理する箱が用意されます。コンテナ単位でサイトに実装するタグを管理するので、コンテナ名にはサイト名やサイトURLを記載すると便利です。ここではウェブページにGoogleアナリティクスのタグを設置するための設定を紹介するので、「ウェブ」を選択します。利用規約が出てくるので右上の「はい」を選択すると、Googleタグマネージャの共通タグが表示されます。このタグをコピーして、指示のとおりにサイトに実装しましょう。

Googleタグマネージャ(GTM)でGoogleアナリティクスを設定しよう

Google アナリティクスタグの実装に移る前に、簡単にGoogleタグマネージャの構成について説明します。

Googleタグマネージャは「アカウント」>「コンテナ」>「タグ」・「トリガー」・「変数」という単位で構成されています。アカウントには複数のコンテナが紐づき、コンテナ単位でタグを管理します。先ほど実装した共通タグには、コンテナのID(GTM-■■■■の部分です)が記載されています。コンテナ単位でタグを管理するときに、不可欠な要素が「トリガー」と「変数」です。「トリガー」はタグをいつ、どんな条件で動かすかといったルールのことを指します。

「変数」はウェブページの様々な情報を入れる箱と言えばわかりやすいでしょうか。

例えば、下記条件でGoogleアナリティクスのタグを設定するとします。
・配信条件:ドメイン名が「webbu.jp」のとき
・GoogleアナリティクスのトラッキングID:UA-XXXXXX-X

その場合、トリガーで配信条件を指定し、変数でトラッキングIDを指定します。下記、設定編ではこの条件でGoogle アナリティクスを設定してみましょう。

ページビュー編

実際にタグを作っていきます。まずは、タグ画面の「新規」ボタン、もしくは、サマリー画面の「新しいタグ」をクリックしてください。すると、右からタグの設定画面が出てきますので、タグの設定から始めましょう。「タグの設定」をクリックすると、右から「タグタイプの選択」が出てきますので、ユニバーサル アナリティクスを選択してください。(ここでは、ユニバーサル アナリティクスで作成しています。ユニバーサルアナリティクスについてはこちらの記事を参照してください。 )

次に、Googleアナリティクス設定のプルダウンから「新しい変数」を選択してください。変数には、設定したいトラッキングIDをトラッキングIDに記入して、数の名前には、トラッキングIDを入れておくと後でわかりやすいです。

そして、トリガーを設定します。トリガーをクリックすると、右から「トリガーの選択」が出てきます。今はAll Pagesというタグしかないですが、このトリガーは共通タグが貼ってあるすべてのページで配信するものなので、新たに作成する必要があります。新規作成は右上の「+」をクリックしてください。次にトリガーの設定をクリックすると、「トリガーのタイプを選択」という画面がでてきますので、ここでは、ページビューを選択してください。次に、このトリガーの発生場所を「一部のページビュー」にしてください。この記事では、ホスト名が「webbu.jp」のときに配信するので、「Page Hostname」「等しい」「webbu.jp」と設定しましょう。そして「保存」をクリック。これでタグは完成です。

Googleタグマネージャではタグを設定しただけではタグが配信されません。公開する必要があります。でも、その前に作ったタグが問題なく動くかどうか検証しましょう。それがプレビューです。管理画面のプレビューボタンを押すと、プレビューモードになりますので、同じブラウザ内でタグ配信予定のページを開いてください。すると、下記のようなGoogleタグマネージャの画面が出てきます(「デバッグ コンソール ウィンドウ」といいます)。こちらでタグが動いているかどうか確認しましょう。動いているタグは「Tags Fired On This Page:」の配下に表示され、動いていないタグは「Tags Not Fired On This Page:」の配下に表示されます。そこで問題なければ、「公開」してください。バージョンの名前は各社管理ルールを決めて運用されることをおすすめします。

イベントトラッキング編

Googleタグマネージャを使うとイベントトラッキングも簡単に設定できます。ここでは外部サイトへのリンククリックを取得してみましょう。

まずはタグの作成から。新規作成までは先ほどのページビューと同じ手順で、タグタイプはユニバーサル アナリティクスにしてください。Google アナリティクス設定で先ほど作ったトラッキングIDの変数を選択しましょう。ここからが違うところ。トラッキングタイプはページビューではなく、イベントにしてください。すると、イベント トラッキング パラメータが出てきますので、それぞれ埋めていきましょう。

この記事では、下記条件で設定するとします。

タグのカテゴリ欄には「外部リンク」を記入します。そして、アクションとラベルはそれぞれ新しい変数を作成します。欄右のブロックマークをクリックすると「変数を選択」という画面ができますので、そこでPage URLをクリックしましょう。これで、クリックが発生したページのURLがアクションに入るようになります。

次にラベルですが、こちらでは、出てきた「変数を選択」画面の右上にある組み込み変数をクリックしてください。そして、クリックのClick URLにチェックを入れます。Click URLはリンク先のURLを取得する変数です。チェックを入れると、「変数を選択」画面にClick URLが追加されているので、そちらをクリック。これで、ラベルにリンク先URLが入るようになりました。

そして、非インタラクションヒットの設定です。こちらは「真」にしています。この設定は何かというと、このイベントが発生したらページビューが1PVだったとしても直帰とみなさないようにしますかという設定です。「真」の場合、イベントが発生しても直帰となります(直帰率に影響なし)。「偽」にすると、イベントが発生すると直帰になりません(直帰率に影響あり)。

ここは、サイトの目的によって設定を変えてください。例えば、外部リンククリックをコンバージョンとして見なしているサイトでは、非インタラクションヒットを「偽」にすることをおすすめします。「真」の場合だと、外部リンクがクリックされた=コンバージョンが達成されたのに直帰したことになってしまいます。

次に、トリガーです。ここでは、外部リンクをクリックしたときにイベントが計測される設定にします。新規作成の「+」ボタンをクリックし、トリガーのタイプはリンクのみを選択します。

そして、一部のリンククリックにチェックをいれ、先ほど作成した変数「ClickURL」「含まない」「webbu.jp」にしましょう。こうすることで、リンク先URLが自サイト以外のホスト名だった場合、つまり外部サイトへのリンクをクリックした場合のみ、タグが配信されるようになります。

そして、先ほどと同じく、プレビューしてタグが動くかどうかを確認してください。

プレビューの際、クリックするリンクが同じタブ内でリンク先ページに遷移する設定になっていると「デバッグ コンソール ウィンドウ」でイベントタグが動いたかどうかを確認できないので、リンクは新規タブで開くようにしてください(ブラウザクロームの場合だと「ctrl」キーを押してクリックすると新規タブが開きます)。

プレビューにて問題がなかったら公開してください。

まとめ

ここまで、タグマネージャの概要からGoogle タグマネージャを使った設定の手順までを説明しました。Googleタグマネージャを入れると、Googleアナリティクスの設定が非常に簡単になりますし、ここでは説明しきれませんでしたが、トリガーや変数の設定次第では、直接タグを記述していた場合に難しかったことも簡単に計測できるようになります。ぜひ、タグマネージャを入れて設定してみてください。

<関連記事>

●タグマネージャについて詳しく知りたい方へ

理解を深める!タグマネジメントの心得と管理ツールの仕組み

●ユニバーサルアナリティクスって?

基本を押さえる!ユニバーサルアナリティクス移行攻略(概要編)

モバイルバージョンを終了