Googleタグマネージャーの使い方「Googleタグマネージャーの使い方の基本」

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

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

Googleタグマネージャーを導入することにより、主に3点メリットがあります。

  • タグをまとめて管理できる
  • WEBサイトの反応速度が上がる
  • ボタンクリック等が測定できる

Googleタグマネージャーの使い方を知る大きなメリット

Googleアナリティクス等のタグ複数貼り付けると管理が大変になり、更にはコードが複雑になるのでWEBサイトが重くなります。
これらをタグマネを活用することで解消する事が出来ます。

また、Googleアナリティクスでは把握し難い、WEB上に配置されたボタンのクリックやPDFのダウンロード等のイベントトラッキングも簡単に設定できます。

Googleタグマネージャーの設定方法

Googleタグマネージャーの使い方のタグ設定で設定方法を解説

なにも設定してい常態からの設定方法は、主に2つの工程があります。

  1. タグマネージャーの設定
  2. WEBサイトにタグマネのスニペットを設置

アカウント、コンテナの設定

Googleタグマネージャーでは、WEBサイト毎に、アカウント、コンテナという単位で管理します。これらを登録します。

Googleタグマネージャーの使い方のタグ設定でアカウント画面

スニペットの設置方法

アカウント、コンテナを作成すると、 スニペットと呼ばれるコード を取得する事が出来ます。
これをWEBサイトに貼付ける必要があります。

以下の様にスニペットは2つに分かれていますので、WEBサイトの、<haed>内のなるべく上の方と、<body>の直後に貼り付けます。

もしご利用のWEBサイトがWordPressであれば、header.phpというファイル内に貼付ければ完了です。

Googleタグマネージャーの使い方のタグ設定でスニペットの設置

タグの設定、トリガーの設定、変数の設定

アクセス解析用にGoogleアナリティクスを設置する場合と、イベントトラッキングをする場合の設定について紹介します。

Googleアナリティクスを設置する場合

この場合の流れは主に以下3つの通りです

  • GoogleアナリティクスにWEBを登録
  • タグの設定
  • トリガーの設定

まずは、事前にGoogleアナリティクスにWEBサイトを登録し、プロパティー設定のトラッキングIDをコピーしておきます。

Googleタグマネージャーの使い方のタグ設定でプロパティー設定

タグの設定

タグを選択し、新規のボタンを押します。

Googleタグマネージャーの使い方のタグ設定でタグの設定

Googleアナリティクス:ユニバーサル アナリティクスを選択します。

Googleタグマネージャーの使い方のタグ設定でアナリティクスを選択

Googleアナリティクスの設定の箇所は、「新しい変数」を選択します。

Googleタグマネージャーの使い方のタグ設定で新しい変数

そして、Googleアナリティクスの「トラッキングID」を入力します。

Googleタグマネージャーの使い方のトラッキングID設定画面

トリガーの設定

タグの下にトリガーの設定画面が出ていますので、「ALL Pages」を選択し保存ボタンを押します。

Googleタグマネージャーの使い方のトリガー設定画面

最後に「公開ボタン」を押せば設定は完了です。

Googleタグマネージャーの使い方の公開ボタンの画面

タグマネが正確に設定できているかの検証として、Googleアナリティクスのリアルタイムで確認をします。自分でWEBサイトを開き、ユーザーが1となっていればOKです。

Googleタグマネージャーの使い方のアナリティクスの画面

イベントトラッキングをする場合

変数の設定

イベントトラッキングを設定する場合は、変数で以下のものにチェックを入れて追加しておきます。

Googleタグマネージャーの使い方の変数の設定画面

タグの設定

トラッキングタイプはイベントを選択します。「アクション」「ラベル」に関してはGoogleアナリティクスで情報をイベント情報を収集する際の識別に使います。
非インタラクションのヒットは「儀」を選択します。

Googleタグマネージャーの使い方のタグの設定画面

トリガーの設定

トリガーは「クリックのリンクのみ」を選択します。
トリガーの発生場所は「Click URL」を選択しURLをを入力します。

Googleタグマネージャーの使い方のトリガー設定画面

プレビューで確認

プレビューボタンを押し、タグが正常に動作するかを確かめます。

Googleタグマネージャーの使い方のプレビュー実行画面

タグを設置したWEBサイトを開き、該当する「ボタン」を押します。
「Tags Not Fired On This Event」にあったタグが「Tags Fired On This Event」に移動していればOKです。
最後に、プレビュー画面に戻り「公開」ボタンを押して完了になります。

Googleタグマネージャーの使い方のプレビュー確認画面