Googleタグマネージャをご存じでしょうか？Webサイトの管理運営では欠かせないツールの一つなので、基本的な使い方についてはぜひともマスターしておきたいもの。Googleタグマネージャの特徴や主な機能、基本的な使い方についてまとめました。
Googleタグマネージャの基礎知識
はじめに、Googleタグマネージャの基本的な知識についてまとめておきましょう。
煩雑になりがちなタグの管理
Webページを運営する時は、Googleアナリティクスやサーチコンソールなどのサービスを利用することがほとんどです。こういったサービスを利用するには、HTMLコード内に指定されたタグを設置するケースが多いです。
例えば、Googleアナリティクスの場合は下のコードをHTMLのheadタグ内に設置します。
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-XXXXXXXX-X', 'auto');
ga('send', 'pageview');
</script>
Webページにはこういったタグをいくつも設置するのですが、その管理が煩雑になってしまうことが多いです。サービスの数に従ってタグも増えていきますし、ページごとに設置するタグを変える必要もあったりするからです。
また、サイトを改修するときにもタグの管理は手間になります。WordPressのテーマを更新する時もタグを移す必要がありますし、下手をするとせっかく設置したタグが上書きされて消えてしまうこともあるかもしれません。
Googleタグマネージャでタグの管理が楽になる
こういった悩みを解決してくれるのが、本稿でご紹介するGoogleタグマネージャです。検索エンジンを提供しているGoogleがリリースしているツールで、無料で使っていくことができます。
Googleタグマネージャを使うと、HTMLに設置するタグを効率的に管理できるようになります。それ以外にも、タグを便利に使っていくことのできるさまざまな機能が備わっています。
Googleタグマネージャの主な機能
Googleタグマネージャの使い方に入っていく前に、主な特徴を3つご紹介しておきましょう。
タグがまとめて管理できる
上で解説したように、Webページを運営する時にはHTMLソース内に複数のタグを埋め込む必要があります。Googleタグマネージャを使うことで、こういったタグをまとめて管理することができるようになります。
Googleタグマネージャは、コンテナと呼ばれる単位でタグを管理します。一つのコンテナには、複数のタグを設定することができます。一つのコンテナをHTMLに貼りつけるだけで、必要な全てのタグが読み込まれるという仕組みになっているのです。
公開前に確認ができる
Googleタグマネージャにはプレビューやデバッグ機能が備わっています。これは実際にタグを機能させる前に、その動作を確認しておくことができるというもの。公開前にタグが正しいかがチェックできるので、間違いを防ぐことができます。
バージョン管理ができる
Googleタグマネージャを使うと、タグのバージョン管理ができるようになります。Googleタグマネージャではタグの変更履歴が保存されるので、以前のバージョンに戻すことも簡単にできます。
Googleタグマネージャの使い方
ここからは、Googleタグマネージャの使い方について解説していきます。
アカウントの登録
まずはGoogleタグマネージャのアカウントを作成しましょう。
Googleアカウントにログインしたあと、下のリンクからGoogleタグマネージャのトップページを開きます。画面右側にある「今すぐ登録」ボタンをクリックして、アカウントの登録に進みます。
下のように、アカウントの作成ページが表示されたでしょうか。
「アカウントの設定」欄で「アカウント名」を入力してから、「続行」ボタンをクリックします。
「コンテナの設定」欄がアクティブになるので、「コンテナ名」にサイトのURL等を入力します。「コンテナの使用場所」では「ウェブ」を選択しておきましょう。選択ができたら、「作成」ボタンを押してください。利用規約が表示されるので、確認したのち問題なければ「はい」をクリックします。
上のような画面が表示されたでしょうか？
タグマネージャをインストールする
先ほどの画面に、Googleタグマネージャのスニペットが表示されていたかと思います。こちらのコードを、対象とするサイトのHTMLソースに追加していってください。タグを適用する、全ページに貼りつけることをお忘れなく。
以上で、対象サイトでGoogleタグマネージャを使う準備が整いました。ただし、作成したコンテナはまだアクティブになっていません。
コンテナにタグを追加する
上で作成したコンテナは、まだ空です。サイトで管理するタグを追加していきましょう。
先ほどのトップページから、「新しいタグを追加」をクリックしてください。
タグの追加画面が表示されました。
上側の「タグの設定」をクリックすると、「タグタイプを選択」欄が右からスライドして表示されます。
ここから任意のタグタイプを選択して、タグ情報を入力していきます。ここでは「ユニバーサル アナリティクス」を選択して進めていきましょう。
「トラッキングID」を入力したのち、画面下側の「トリガー」をクリックします。「トリガーの選択」欄が右からスライドして表示されたでしょうか。
ここでは「All Pages」を選択します。ここまでで、下のようにタグが指定できているはずです。
画面右上の「保存」ボタンをクリックしてコンテナ名を入力、保存すれば、コンテナへのタグの追加が完了です。
コンテナを公開する
最後に、コンテナを公開しましょう。
Googleタグマネージャのトップページ右上にある「公開」ボタンをクリックしてください。
公開するバージョンの「名前」と「説明」を入力して、右上の「公開」ボタンを押します。
これでコンテナの公開が済んだので、追加したタグも機能しているはずです。
Googleタグマネージャを使う時の基本的な流れは以上で終わりです。必要に応じてトリガーをカスタマイズしたり、プレビューやデバッグを使っていくと良いでしょう。
あとがき
Googleタグマネージャの特徴や基本的な使い方についてご紹介しました。タグの管理はWeb運営では欠かせないので、Googleタグマネージャを活用しながら効率的に行っていくようにしましょう。