ウーロンぷらいず

ウーロンぷらいず

楽するためにがんばる人の雑記ブログ

Googleタグマネージャの初期設定!初心者でも簡単にアナリティクスを管理

f:id:oolongprize:20181025182328j:plain

ちゃお!ウーロンです。

今回はGoogleタグマネージャの設定方法をできるだけ分かりやすく紹介していきます。

 

Googleタグマネージャは、ウェブサイトやアプリに含まれる「タグ」(トラッキング コードや関連するコード)を素早く更新できます。タグを一括で簡単に管理するツールです。もちろん無料です。

 

Googleタグマネージャの設定には、Googleアカウントが必要です。
もし、アカウントを持っていない人はこちらを参考にして作成してください。
 

oolongprize.hatenablog.com

 

それではスタート!

 

Googleタグマネージャにサインイン 

 

Googleタグマネージャのトップページにアクセスします。

 

Google タグマネージャ トップページはこちら

 

下のように表示されます。画面右上の「Start for free」をクリックします。

f:id:oolongprize:20181025111849p:plain

 

下のように表示されます。メールアドレスを入力して、「次へ」をクリックします。

f:id:oolongprize:20181025112841p:plain

下のように表示されます。パスワードを入力して、「次へ」をクリックします。

 

f:id:oolongprize:20181025113219p:plain

 

これでGoogleタグマネージャにサインインしました。

 

アカウントを作成

下のように表示されます。「アカウントを作成」をクリックします。

 

f:id:oolongprize:20181025114304p:plain

 

下のように表示されます。

 

f:id:oolongprize:20181025114758p:plain

①アカウント名

なんでもOKです。あとで変更できます。

 

②国

国を選択します。多くの方は「日本」だと思います。

 

Googleや他の人と匿名でデータを共有

チェックを入れると、データを匿名で共有してベンチマーク サービスをご利用できます。ベンチマーク サービスは、あなたのサイトとその他のサイトを比較できるサービスです。あとで変更できるので、私はチェック外しました。

 

すべて確認して、「続行」をクリックします。

 

コンテナを作成

下のように表示されます。

f:id:oolongprize:20181025133216p:plain

 

①コンテナ名

コンテナとは複数のタグを管理するための箱のようなものです。基本は1サイトにつき、1コンテナとなります。
コンテナ名は、なんでもOKです。あなたのサイトのURLやブログ名の入力をオススメします。

 

②コンテナの使用場所

ウェブ、iOS、Android、AMPの中から選択します。私の使用環境では、「ウェブ」となります。

 

すべて確認して、「作成」をクリックします。

 

下のように表示されます。利用規約をすべて読みます。同意する場合は、画面右上の「はい」をクリックします。

 

f:id:oolongprize:20181025140834p:plain

 

タグを取得

下のように表示されます。タグを取得しました。

 

f:id:oolongprize:20181025142822p:plain

①、②のコードをサイト内すべてのページに貼りつけます。

①は、<head>内のなるべく上のほうに貼りつけます。

②は、<body>直後に貼りつけます。

 

貼付が完了したら、「OK」をクリックします。

 

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

今回はGoogleアナリティクスのタグを追加します。もし、まだGoogleアナリティクスの登録をしていない方は、下の記事を参考に登録しましょう。

 

oolongprize.hatenablog.com

  

それでは、さっそくタグを設定しましょう。

ワークスペースの「新しいタグを追加」をクリックします。

  

f:id:oolongprize:20181025152113p:plain

 

 下のように表示されます。「名前のないタグ」をクリックして名前を変更します。なんでもOKです。その後、「タグの設定」をクリックします。

 

f:id:oolongprize:20181025153047p:plain

 

 

下のように表示されます。「Googleアナリティクス・ユニバーサル アナリティクス」をクリックします。

 

f:id:oolongprize:20181025153755p:plain

 

 下のように表示されます。

 

f:id:oolongprize:20181025191443p:plain

 

①トラッキングタイプ

ページビューを選択します。

 

このタグでオーバーライド設定を有効にする

チェックを入れます。すると下にトラッキングIDのフィールドが表示されます。

 

③トラッキングID

GoogleアナリティクスのIDを入力します。次のようなIDです「UA-**********」。このIDはGoogleアナリティクスの管理画面のトラッキングコードから確認できます。

f:id:oolongprize:20181025161045p:plain

 

タグの設定が終わったら、次にトリガーの設定をします。トリガーとは、タグの実行する条件のことです。

トリガー」をクリックします。

 

f:id:oolongprize:20181025161629p:plain

 

下のように表示されます。「All Pages」をクリックします。

 

f:id:oolongprize:20181025161919p:plain

 

下のように表示されます。「保存」をクリックします。

 

f:id:oolongprize:20181025162642p:plain

 

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

 

動作確認

動作確認をしましょう。画面右上の「プレビュー」をクリック。

 

f:id:oolongprize:20181025163253p:plain

 

下のように表示されます。オレンジ色で「プレビュー中のワークスペース」とでます。

 

f:id:oolongprize:20181025163952p:plain

 

この状態で、タグを埋め込んだ、あなたのサイトにアクセスします。

画面下側に、下のような表示がでます。

 

f:id:oolongprize:20181026130904p:plain

 

①Tags Fired On This Page

ここに表示されているタグは実行されています。

 

②Tags Not Fired On This Page

ここに表示されているタグは実行されていません。

 

①に上記のようなタグが表示されていれば、OKです。正しく機能しています。

 

公開

Googleタグマネージャの管理画面にもどります。プレビューモードを終了するため、「プレビューモードを終了」をクリックします。

 

f:id:oolongprize:20181025171434p:plain

 

下のように表示されます。「OK」をクリックします。

 

f:id:oolongprize:20181025171713p:plain

 

下のように表示されます。「公開」をクリックします。

 

f:id:oolongprize:20181025192721p:plain

 

下のように表示されます。

 

f:id:oolongprize:20181025172910p:plain

 

①バージョン名

なんでもOKです。分かりやすい名前をつけます。

 

②バージョンの説明

変更した際には、変更点の詳しい説明を記入します。

 

すべて確認後、画面右上の「公開」をクリックします。

これですべてのタグの設置が完了しました。

 

最終確認

最終確認をします。Googleアナリティクスにサインインします。また、タグの埋め込んだサイトにアクセスします。この時、Googleアナリティクスのリアルタイムで確認しましょう。正常に解析していれば完了です。

 

f:id:oolongprize:20181025180644p:plain

 

おめでとうございます!すべての設定が完了です!!

 

まとめ 

本記事では、Googleタグマネージャの登録・設定、Googleアナリティクスのタグ設定を紹介しました。初心者の方も意外と簡単に設定できたと思います。

最初の設定さえすれば、タグを一括で簡単に管理できますので工数も減ります。とても便利でオススメのツールです。ぜひ導入してみてください。