グーグルタグマネージャーの始め方の解説とメリット

グーグルタグマネージャーの始め方の解説とメリット

グーグルタグマネージャーの導入手順とメリットについて

#123 GTMの導入

WEB制作

グーグルタグマネージャーを入れて良かった点は、イベントトラッキングが簡単にできるようになったことです。ただGTMの概念や導入方法ってわかりづらい。初めて見ようかなという初心者の方向けに図をたっぷり使って解説記事を書きました。

公開日:
最終更新日:

商品リンクにアフィリエイト広告を利用しています

サイトマップサイトマップ

Google Tag Manager 通称GTMを使ってみよう

Google Tag Manager、通称GTMというタグを管理する「無料」で使えるツールがありまして、個人ではそんなに使うメリットないかなと思ってました。

個人ブログだと管理するほどタグ使わないですからね。わかります。
実はタグを管理する以外にも便利な使い方があるんです!

今回はグーグルタグマネージャーを使って、アナリティクスを設定する、までを解説します。
イベントトラッキングは次回の記事で説明いたします。

ワードプレスユーザーにははむらいとさんの解説記事がオススメ

グーグルタグマネージャーを導入したいと考えているワードプレスユーザーの方は、はむらいとさんのGTM解説記事がオススメです。

読み込み中

グーグルタグマネージャーの説明

そもそもタグってなに?ってなりますよね。
個人サイトで使うタグって、グーグルアナリティクスくらいしかないんですけど、アナリティクスタグを管理すると言われてもピンとこないですね。

タグ埋めるだけだから別に手間じゃないしと。
うん、それは正しい意見です。

これから説明するメリットが別に必要ない、という人は無理やり導入する必要はありません。

GTMを使うとアナリティクスのタグの表示が早くなる

1つ目のメリットは、GTMを使うとアナリティクスのタグの処理が早くなると。
アナリティクスのタグの表示が「非同期」処理になって、ページの表示速度が速くなります。

非同期処理とは?

WEBページが表示される場合、サーバーにページの情報を頂戴とリクエストが飛ぶんですが、通常WEBサーバーはHTMLで書かれたすべての情報を返すわけです。

上から下までぜーんぶの情報を戻しますが、表示されてないページの下にある情報は今じゃなくてもいいでしょ、その時が来たら表示してよ、というのが非同期処理です。

必要のない情報のリクエストを減らして、少しでもファーストビューの表示速度を早くしなさいと、Googleは指導しています。

GTM使わなくても非同期のアナリティクスタグもあるんですけどね。
グローバル サイトタグ(gtag.js)利用している方は非同期でアナリティクスタグが動きます。

管理がラクチンになる

GTMを使うと、HTMLページを編集しないでタグの差し替え、追加、編集ができるようになります。

CMSとか使っていると、普段使わないテンプレートページとかにタグを埋め込む必要があるじゃないですか。
ヘタにいじると表示が崩れるようなファイルを編集しないといけないと。

そういったリスクを軽減できるのがタグマネージャーのメリット。

グーグルタグマネージャーのメリット
管理画面から追加と削除ができる

GTMに追加するタグは、基本的にどんなタグでも管理できます。
とはいっても、個人で使うタグってのは、アナリティクスとアドセンスぐらいなもんなんですが、WEB広告で使ういろいろなタグがある場合は、GTMを使うと便利です。

アナリティクスタグは数年に1回変更される

WEBの技術って日々進化しますから、計測用のトラッキングコードが変更になることがちょこちょこあります。
古いタグでも使えなくはないんですが、サポート期間が終わったら使えなくなります。

差し替えなきゃいけないときがあるわけです。
そんなときにGTMでアナリティクスタグを管理していると、ページを編集しなくても差し替えられると。

まぁ、今すぐに差し迫っている問題じゃないわけですが。

グーグルアドセンスのタグもこれで管理できます

例ではアナリティクスのタグの管理方法を書いていますが、アドセンスのタグもGTMで簡単に追加できるようになります。

全ページに同じタグを張り付ける作業が、GTMを一度設置しておくと簡単に管理できるようになるのがメリットです!

アナリティクスのイベントトラッキングが簡単にできる

私がGTMを入れた一番の理由がコレです。

サイト内に広告を色々仕込んでいるわけですが、どの商品がクリックされたかをアナリティクス上で計測できるようになります。

イベントトラッキングの仕方によって取得できる情報は変わりますが、私が取得している情報は3種類。
イベントラベルが3つしかないから3種類なんですけど。

どのページからクリックが発生しているか

「イベントカテゴリ」を使ってどのページからクリックが発生しているかが、URL単位で計測できます。

GTMイベントトラッキング
規約が怖いのでぼかしてます

こないだUPしたオリーブオイル化粧品 サンプル0円でものすごくよい商品を入手したので、それをお伝えする記事を書いたところ、その記事ページから4クリックが発生したと。

ただ、このURLはクリックが発生したURLというだけで、どの商品がクリックされたかがわかりません。

↑ページが気になるかたはこちら!

どんなテキストがクリックされているか

アクションラベルに割り当てている情報が、「クリックテキスト」にしています。
アンカーリンクで設定されているテキストを取得できるわけです。

GTM イベントトラッキング
クリックされたテキストを取得

これを見ると「Amazonで詳細を見る」が一番クリックされていることがわかります。
Yahooは2番目ですね。

このテキストが使用されているボタンは、記事の本文中か、PCの場合はサイドバー、SPの場合は記事終わりに張ってある商品リンクからと私にはわかります。

オリーブマノンの商品サンプルは4クリックですね。

なにがクリックされたかがわかる

3つ目のイベントラベルには、data属性を使って「商品名」を表示するように設定しています。

未定義のものは not setが表示されます。一番多いやん。

GTM イベントトラッキング
クリックされた商品名を取得

アフィリエイトをやっているならイベント計測がオススメ

アフィリエイトの広告タグって、広告主側のミスで計測ができなかったり、ASPのタグのトラッキング漏れなんかで、数が合わないことがあります。

そんなときに、こっち側で証左となるクリック数が計測できていると、いざという時の交渉の役に立ちます。

私はA8ランク「ホワイト」の弱小なので、そんな機会ないんですけどね!

クリック計測ができるとアピール商品の位置変更などに役立つ

どのページのどの商品がクリックされたかを把握できると、目立った場所に置いている商品があまりクリックされない、逆に端っこにおいてある商品なのにクリックが多いなどが把握できます。

サイトのデザインや構成にもよりますが、目立つ場所ほどクリック率が高いのは自明の理なので、クリック率が高い場所に人気商品を置くのが、効率的なわけです。

どの商品がクリックされているかが把握できると、テストの判断材料になるのでオススメです。

このクリックイベントの計測は次の記事で紹介します。
すみません、GTMの導入を書いていたらややこしくなってしまったため。

GTMでアナリティクスを使う導入方法

グーグルアカウントがあれば無料で簡単に導入ができます。
GTMのタグを設置しないといけないのがちょっと手間ですが。

グーグルタグマネージャーのページにいってアカウント登録

GTMのページにいってアカウントを取得してください。

アカウントを作ったらタグマネージャーのTOPに移動して、超絶わかりづらいこのページを使ってタグの設定をしていきます。
ここのUIは初心者お断り感がハンパないんですが、負けないで設定していきましょう。

タグを選択してGAタグの定義をする

GTMの管理画面に入ったら、左側にある「タグ」をクリックしてください。
タグを選択したら、タグの中にある「新規」をクリックします。

GTM タグの新規作成
タグを新規作成する

タグを新規作成

新規をクリックすると、右からウィンドウがでてくるので、「タグの設定」にマウスをのせるとえんぴつがでますので、それをクリック。
マウスをのせないとえんぴつでないのでご注意ください。

GTM タグの設定
マウスをのせないとでないので注意

一番上のアナリティクスを選ぶ

えんぴつをクリックすると、また右からでてくるので、アナリティクスの一番上のやつをクリックしてください。

GTM GAの選択
アナリティクスの一番上を選択

選んだアナリティクスの設定

「トラッキングタイプ」と「アナリティクス設定」はそのままでOKです。
その下にある「このタグでオーバーライド設定を有効にする」にチェックを入れます。

チェックを入れるとアナリティクスのトラッキングコードを入力するボックスが表示されます。

GTM ページビューの設定
ページビューの設定

アナリティクスのトラッキングIDの確認方法

アナリティクスの管理画面に行って、左下にある「歯車(管理)」を押して、出てきたウィンドウの左から二番目にある「トラッキング情報」をクリックし、「トラッキングコード」を選択してください。

GA トラッキングIDの確認
トラッキングIDの確認

トラッキングIDをコピペ

UAから始まる、トラッキングIDが表示されるのでそれをコピペします。

トラッキングIDのコピー
トラッキングIDをコピーする

GTMに戻ってコピペしたトラッキングコードを張り付けてタグの設定は完了です。

トリガーの設定

GTMの管理画面に戻ってきまして、タグの設定がおわったので、次はトリガーの設定です。

トリガーというのは、そのタグは発火する条件です。
アナリティクスの場合はページビューで計測するのでページビューでトリガーを設定します。

下段にあるトリガーのえんぴつをクリックします。

GTM トリガーの設定
GTMトリガーの設定

トリガーの選択画面へ

右から出てくるボックスの「+」をクリックします。

GTM トリガーの選択
GTMのトリガーの選択

ページビューを選択

選択肢の中から「ページビュー」を選択します。

GTM ページビューを選ぶ
トリガーからページビューを選ぶ

名前を付けて保存

わかりやすい名前を付けて、保存をクリックして、トリガーの設定終了です。

GTM トリガーの名前をつけて保存
わかりやすい名前をつける

ここまでで、アナリティクスのタグをGTMで管理する設定が終わりました。

画像が多いのと、1個づつ説明しているので、すごくめんどくさい感じると思うんですが、実際にやるとそんなに手間じゃないので安心してください。

画面から、項目を選んでポチポチするだけですから。

作ったタグをページに埋め込み手順

グーグルタグマネージャーのタグをページに埋め込む必要があります。
あわせて、アナリティクスのタグがすでに設置済みの場合、それを削除する必要があります。
計測がダブってしまうためです。

GTMのタグを取得
ページに埋め込むタグを取得

クリックしたら、計測用のタグが2つ出てきますので、それをページ内に張り付けてください。

準備が整ったらGTMの公開ボタンを押す

タグの埋め込みと、GTM上の設定が完了しましたら、GTMの管理画面にもどり、「公開」ボタンを押してください!

GTM 公開ボタンを押す
公開ボタンを押さないと動きません

ボタンを押して稼働が確認できれば完了です!

グーグルタグマネージャーの設置まとめ

記事を書いてて思ったんですけどね、最後にこんなこと言うのもあれなんですけど、タグマネージャー、普通に運用している人には不要ですね。

無理やり入れるメリットあんまりない

ただし、アナリティクスでクリックイベントを計測したい場合は、すんごい楽です。
GTM入れる前までは自力でイベント作って計測してたんですけど、GTM使うとこんなに簡単に計測できるのかと感動して、記事にしたいなぁと思い、書いたんですけど。

GTMの管理画面やタグマネージメントの概念が、結構難しいので、不慣れな初心者の方にはそこまでオススメできるシロモノじゃないと思いました。便利なんだけどさ。

こういった設定とかが苦手じゃなくて、イベント計測したい方にはオススメします。
解説まだしてないんだけど。

もしイベント計測に興味がありましたら次の記事もよろしくお願いいたします。

記事内で紹介している商品リスト
(価格はAmazon参考価格)

実践 Google タグマネージャ入門 増補版

874円(税込)

実践 Google タグマネージャ入門 増補版

デジタルマーケターとWeb担当者のためのGoogle&Yahoo!タグマネージャーの教科書

4,980円(税込)

デジタルマーケターとWeb担当者のためのGoogle&Yahoo!タグマネージャーの教科書

現場のプロから学ぶ SEO技術バイブル(特典PDF付き)

3,278円(税込)

現場のプロから学ぶ SEO技術バイブル(特典PDF付き)

UP-BLOG 申込みが止まらないブログの作り方 (マーチャントブックス)

2,585円(税込)

UP-BLOG 申込みが止まらないブログの作り方 (マーチャントブックス)

これからのSEO内部対策 本格講座

1,870円(税込)

これからのSEO内部対策 本格講座

Webプロジェクトを成功に導く 戦略的SEO思考

1,920円(税込)

Webプロジェクトを成功に導く 戦略的SEO思考

いちばんやさしい新しいSEOの教本 第2版 人気講師が教える検索に強いサイトの作り方[MFI対応] (「いちばんやさしい教本」シリーズ)

1,738円(税込)

いちばんやさしい新しいSEOの教本 第2版 人気講師が教える検索に強いサイトの作り方[MFI対応] (「いちばんやさしい教本」シリーズ)

10年つかえるSEOの基本

1,628円(税込)

10年つかえるSEOの基本

文芸オタクの私が教える バズる文章教室 (サンクチュアリ出版)

1,540円(税込)

文芸オタクの私が教える バズる文章教室 (サンクチュアリ出版)

GTMの導入の関連ページ

GTM イベントトラッキング

GTMを使ってイベント計測を簡単に行う方法

グーグルタグマネージャーを使ってイベントトラッキングを計測する方法の手順を解説。何がクリックされたかを知ることは大事です

OGP設定

OGP設定をしてSNSからの流入とCTRを改善する

シェアするとき、シェアしてもらうときに最適な形で紹介したいとなるとOGP設定をしっかり設定することが重要です

構造化データとパンくずリスト

構造化データで作るパンくずリストとSEO

SEO上必須ともいえる構造化データ化されたパンくずリストの解説と、ユーザー目線で考えるパンくずリストの価値について

カノニカルとリダイレクト

SEOの必須項目 カノニカル設定とリダイレクト設定

URLの正規化というややこしい話なんですが、SEO上正規化をしておくことは必須項目というべき大事な設定です

Googleアップデート対策

Googleコアアップデートで順位が下がったときにやるべきこと

Googleのアルゴリズム変更によるGoogleコアアップデートでSERPsの順位変動が起きたときにやったこと

SEO titleとh

SEOで重要なtitleタグとhタグの使い方

SEOの内部構造の基本であるTitleタグとHタグの使い方と自分の考えを書きました。 基本だからこそ重要な要素

GA4カスタムイベント

GA4 GTMを使ったカスタムイベントの設定方法

GA4のカスタムイベントをGTMを使い設定する方法です。 イベント、パラメータ、カスタムディメンションの解説記事です。

SEOキーワード選定

SEO キーワード選定の方法を考察してみた

SEOは結構頑張っていますが、キーワード選定という手法をあまり深く考えたことがなかったので深く考えてみました。

リンク構造

ブログのアクセスアップに欠かせないSEO的リンク構造の考え方

SEOのリンク構造を効果的に作るための情報をまとめました。 可能な限り情報の出どころのリンクも用意しております。

SNSでこの記事をシェアできます

ブログ デイリーアクセスランキング

車用スマホホルダー
1位

車用スマホホルダー

スマホをカーナビとして使うと熱さで充電ができなくなるので、熱対策と1年間使って外れることがなかったスマホホルダーの紹介。

ノートPCスタンド
2位

ノートPCスタンド

ノートパソコンを横にしまうと結構な専有面積があるのですが、立てて収納できればわずか数cmで使えるので本当に快適です!

PHPで作るカレンダー
3位

PHPで作るカレンダー

forとifとforeachがメインのPHPによるカレンダーの作り方です。 祝日設定がちょっとめんどくさいんですよね。

MusicBeeのレイアウト変更方法
4位

MusicBeeのレイアウト変更方法

MusicBee 3.1のレイアウトをデフォルトの状態から、自分好みのレイアウト設定に変更する方法を写真付きで紹介しています。

机上台
5位

机上台

机上台という机の上に設置し、モニターを置きデッドスペースになるモニターの下に空間を生み出す悪魔的発想の商品を使ってみました。

MusiceBee
6位

MusiceBee

PCで音楽の再生と管理をするならiTunseよりもMusicBeeがオススメです。軽くて早くて便利で使いやすい。

PHPを使って作るCMS
7位

PHPを使って作るCMS

PHPを覚えたらデータベース回りも一緒に覚えるのがオススメです、 制作できるものの幅が広がって色々な仕組みを理解できます

PHPで作るカレンダーの作り方2
8位

PHPで作るカレンダーの作り方2

PHPで作るカレンダーの作り方の第二弾です。 今回はクリックした日付を取得してformに代入するところも解説してます。

108cmの机上台
9位

108cmの机上台

FENGEの108cm 2段式の机上台レビュー! 横幅が広く収納力抜群でデザイン性もいいので非常に満足しています!

Bluetoothイヤホンの使い方
10位

Bluetoothイヤホンの使い方

Bluetoothイヤホンのペアリング方法やリモコンの操作方法、リダイヤルの防止策を画像入りで解説します。

カテゴリ一覧

オススメ商品レビュー

オススメ商品レビュー

世の中にある比較サイトや、いかがでしたか系サイトが嫌いなんです。使ってないのにえらそうなこと言うなと。なので体験談です。

WEB制作

WEB制作

WEBサイトを作れますと一言に言っても色々な技術があるわけですよ。アウトプットの形は一緒でもいろいろこだわりがあるんです。

カメラ

カメラ

2018年4月に購入したソニーのミラーレス一眼「α7Ⅲ」に関連する記事一覧ページです。 作例集やカメラグッズレビューなど。

美味しいもの

美味しいもの

食に関してはあまりこだわりがないんですけどね、こだわりがない分美味しいと思ったものは本当においしいと思ったものなんですよ

Amazonプライム動画

Amazonプライム動画

Amazonプライム会員なら無料で利用できるAmazonプライム動画から、いろいろな動画をみたレビュー記事のまとめページ

旅LOG

旅LOG

家族旅行やおでかけした際の旅ブログです。夏休みの家族旅行(4人家族)で訪れた観光名所の感想などを記しています。

プロフィール

プロフィール

Start-Point.netの管理人のプロフィール紹介を兼ねた、自分の中のルールや決め事やエピソードなでお書いていきます

日記

日記

日記と言っても色々な日記があるわけで、記録的な日記や心理描写を色濃く描いた日記などをまとめたページです。

thanks

thanks

自分を表現することって意外と難しいんですよね。照れがあったり、間違ったこといってないかとよくわからない何かと戦ったりして。

記事内で紹介している商品

実践 Google タグマネージャ入門 増補版

874
(税込)