よくわかるGoogle タグマネージャの使い方

Googleタグマネージャーの基本の使い方とGoogleアナリティクスタグの設置まであわせて説明します。
Googleタグマネージャ
Googleタグマネージャ
基本の使い方からアナリティクスタグの設置まで

少しウェブサイトの規模が大きくなるとサイトのアクセス状況を確認するためのアナリスティックタグや広告効果測定用のコンバージョンタグの運用が必要になってきます。 これらの複数のタグを管理するには、HTML の知識が必要だったりソースの修正が必要になってきます。 Googleタグマネージャを使えば、毎回ソースを修正したりする必要もなく、管理画面から入力するだけ

この記事では、Googleタグマネージャの基本の使い方およびGoogleアナリテックスタグの設置まで、説明します。

Googleタグマネージャのインストール

Googleタグマネージャ(以下、GTMと略す)は、以下のサイトから始めます。

ログイン

GTMのサイトにアクセスしたら、Googleアカウントで、右上にあるタグマネージャにログインしてください。

画像を拡大表示する
"Googleタグマネージャにログインする"を説明する図
Googleタグマネージャにログインする

アカウント作成手順

画面右上のアカウントを作成をクリック!

※下記の画面例では既にいくつかのアカウントが作成済みです。

画像を拡大表示する
gtm-first-02.png photo

利用規約が表示されるので同意してください。

画像を拡大表示する
"利用規約の表示"を説明する図
利用規約の表示

登録内容を入力します。入力する項目は

  • アカウント名
  • コンテナ名
  • ターゲットのプラットフォーム

アカウント名は識別できる名前なら何でもかまいません。コンテナ名は、対象となるサイトURLを入力すると後からわかりやすいかもしれません。入力が終わったら、作成ボタンで作成してください。

画像を拡大表示する
"アカウント情報入力"を説明する図
アカウント情報入力

次に画面では、Googleタグマネージャのインストールタグが表示されますので、画面に指示に従ってサイトを修正してください。

画像を拡大表示する
"Googleタグマネージャインストールタグ"を説明する図
Googleタグマネージャインストールタグ

今作ったアカウントのワークスペース画面が下記の通りです。最初にアカウントを登録するとDefault Workspaceという名前のワークスペースが1個自動的につくられ、これがデフォルトになります。

画像を拡大表示する
"アカウント作成完了"を説明する図
アカウント作成完了

アカウント、コンテナ、ワークスペース?

ちょっと、わかりにくいので説明します。

アカウント-これはgoogleのアカウントのことではなく、コンテナを収容するためにグループです。複数のアカウントを作成することができ、かつメールアドレスを持つとかのなんの制限もない単なる名前です。

コンテナ-管理するサイトのグループで、ある会社がつくっているサイトであったり、個人が作っているサイトだったりします。一つのコンテナを作成するとGoogleタグマネージャIDがひとつは発行されます。

ワークスペース-これは作業環境で、一つのサイトで最大3つまで作ることが出来ます。

Googleタグマネージャの動作概念

次のトピックに入る前に、Googleタグマネージャの動作を理解する上で重要な概念を説明します。Googleタグマネージャには基本的なものとして、タグ、トリガー、変数の3つの要素があります。

shape-2020-03-23_002.jpg photo

まず、トリガーですが、トリガーとはタグを動作させる条件のことで、タグの動作を発火といいますが、タグを発火させる引き金となるのがトリガー と考えれば簡単です。例としては、あるURLで定義される特定ページでトリガーとする場合や変数(これも後で説明)の内容によってトリガーとすることができます。

次にその変数ですが、PCやスマホを区別するためのユーザーエージェントの値であったり、ページの滞在時間であったり、Youtubeの動画を開始したかどうか等も変数として持つことができ 、なおかつこれら変数は条件付けすることができます。

最後にタグですが、上記のトリガーでもって発火させることができ、発火するとGoogleアナリティクスにイベントを渡すことができます

Googleアナリテックスタグを発行してみよう!

まずはともあれ、Googleタグマネージャを導入したら最初にやってみること。それはGoogleアナリテックスタグを発行して統合してしまいましょう。ここで注意しなければならないことは、タグがダブってしまいますので、もし統合してしまうと既存のGoogleアナリテックスコードを削除しなければならなということです。

正しいコンテナとワークスペースを選ぶ

あなたはどのサイトのタグを修正しますか? 対象のサイトとコンテナは同一ですので、正しいコンテナを選びます(図中の①)。次にワークスペースを選びますが、多分まだ1つしかないので、Default Workspaceとなっているハズです(図中の②)。

画像を拡大表示する
"正しいコンテナを選ぶ"を説明する図
正しいコンテナを選ぶ

GoogleアナリティクストラッキングIDのための変数をつくる

トラッキングIDはこれからもよく使うので共通に使えるように変数に持つようにします。

最初に、左側のメニューより変数を選びます(図中①)。次に組み込み変数ではなく、ユーザー定義変数のところの新規ボタンをクリックします。

画像を拡大表示する
"変数作成手順1"を説明する図
変数作成手順1

変数を設定するために、図にある矢印部分をクリック。

画像を拡大表示する
"変数作成手順2"を説明する図
変数作成手順2

変数のタイプとして、“Googleアナリティクス設定”を選びます。

画像を拡大表示する
"変数作成手順3"を説明する図
変数作成手順3

の部分に対象サイトにつかっているGoogleアナリティクスのトラッキングIDを入力し、②の部分に変数名を入力します。もし入力しない場合は、デフォルトの“Googleアナリティクス設定”がつかわれます。

画像を拡大表示する
"変数作成手順4"を説明する図
変数作成手順4

これで変数が作られました。次にタグを作っていきます。

画像を拡大表示する
"変数作成手順5"を説明する図
変数作成手順5

タグを作成する

タグを作成するには、画面左側よりタグを選択、次に画面右上にある新規ボタンをクリックします。

画像を拡大表示する
"タグ作成手順1"を説明する図
タグ作成手順1

タグを設定するために、図の矢印部分で示した部分をクリックします。

画像を拡大表示する
"タグ作成手順2"を説明する図
タグ作成手順2

タグのタイプとして、Googleアナリティクスユニバーサルアナリティクスを選びます(クリック)。

画像を拡大表示する
"タグ作成手順3"を説明する図
タグ作成手順3

/

Googleアナリティクス設定の空欄部分に、先に作った変数を選んで入れます。その他は、画面の通り変更しません。

画像を拡大表示する
"タグ作成手順4"を説明する図
タグ作成手順4

トリガーとして”All Pages”を選ぶために、画面の矢印部分をクリックします。

画像を拡大表示する
"タグ作成手順5"を説明する図
タグ作成手順5

画面のとおり、All Pagesを選びます。

画像を拡大表示する
"タグ作成手順6"を説明する図
タグ作成手順6

画面のとおり設定できていることを確認し、画面右上の保存ボタンをクリックします。

画像を拡大表示する
"タグ作成手順7"を説明する図
タグ作成手順7

保存するタグ名が表示されますので、問題がなければそのまま保存を実行して終了です。

画像を拡大表示する
"タグ作成手順8"を説明する図
タグ作成手順8

これが作成されたタグです。

画像を拡大表示する
"タグ作成手順9"を説明する図
タグ作成手順9

これで、アナリティクスタグの統合が無事終了しました。今までGoolgeアナリティクスからおこなわれていましたが、Googleタグマネージャを通してカウントされるようになったと思います。もし動作が確認出来ない場合は、トラッキングidの入力ミスとか単純な事だと思いますので再確認してみてください。そんなに難しいことではないハズです。どうしてもわからない場合は、Googleタグマネージャにプレビューというデバック機能がありますので、以下の記事 (鋭意作成中) を参考にデバックしてみてください。

その他のトリガーの使い方が学べる”設定すべき重要なトリガー解説”(鋭意作成中)を記事にしていますので、こちらも参考にしてください。

以上

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

スポンサーリンク

googleカスタム検索

ランキング

インデックス

※右側の記事と連動したインデックスです。見たいインデックスをクリックしてください。
ページ上部へ戻る