WEB制作グーグルタグマネージャーを入れて良かった点は、イベントトラッキングが簡単にできるようになったことです。GTMの概念や導入方法ってわかりづらい。見ようかなという初心者の方向けに図をたっぷり使って解説記事を書きました。Manager、通称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単位で計測できます。サンプル0円でものすごくよい商品を入手したので、それをお伝えする記事を書いたところ、その記事ページから4クリックが発生したと。このURLはクリックが発生したURLというだけで、どの商品がクリックされたかがわかりません。Oliveさんの「オリーブマノン」のお試しサンプルを使ってみました。オイルなのにギトギトしないサラサラのオリーブオイルでスキンケアして、ホットタオルパックで至福の時間を楽しみましたサイト内リンク:https://www.start-point.net/blog/item/cosme/olive_manon/↑ページが気になるかたはこちら!どんなテキストがクリックされているかアクションラベルに割り当てている情報が、「クリックテキスト」にしています。アンカーリンクで設定されているテキストを取得できるわけです。クリックされたテキストを取得これを見ると「Amazonで詳細を見る」が一番クリックされていることがわかります。Yahooは2番目ですね。このテキストが使用されているボタンは、記事の本文中か、PCの場合はサイドバー、SPの場合は記事終わりに張ってある商品リンクからと私にはわかります。オリーブマノンの商品サンプルは4クリックですね。なにがクリックされたかがわかる3つ目のイベントラベルには、data属性を使って「商品名」を表示するように設定しています。setが表示されます。クリックされた商品名を取得アフィリエイトをやっているならイベント計測がオススメアフィリエイトの広告タグって、広告主側のミスで計測ができなかったり、ASPのタグのトラッキング漏れなんかで、数が合わないことがあります。そんなときに、こっち側で証左となるクリック数が計測できていると、いざという時の交渉の役に立ちます。私はA8ランク「ホワイト」の弱小なので、そんな機会ないんですけどね!クリック計測ができるとアピール商品の位置変更などに役立つどのページのどの商品がクリックされたかを把握できると、目立った場所に置いている商品があまりクリックされない、逆に端っこにおいてある商品なのにクリックが多いなどが把握できます。サイトのデザインや構成にもよりますが、目立つ場所ほどクリック率が高いのは自明の理なので、クリック率が高い場所に人気商品を置くのが、効率的なわけです。どの商品がクリックされているかが把握できると、テストの判断材料になるのでオススメです。このクリックイベントの計測は次の記事で紹介します。すみません、GTMの導入を書いていたらややこしくなってしまったため。GTMでアナリティクスを使う導入方法グーグルアカウントがあれば無料で簡単に導入ができます。GTMのタグを設置しないといけないのがちょっと手間ですが。グーグルタグマネージャーのページにいってアカウント登録GTMのページにいってアカウントを取得してください。グーグルタグマネージャーアカウントを作ったらタグマネージャーのTOPに移動して、超絶わかりづらいこのページを使ってタグの設定をしていきます。ここのUIは初心者お断り感がハンパないんですが、負けないで設定していきましょう。タグを選択してGAタグの定義をするGTMの管理画面に入ったら、左側にある「タグ」をクリックしてください。タグを選択したら、タグの中にある「新規」をクリックします。新規をクリックすると、右からウィンドウがでてくるので、「タグの設定」にマウスをのせるとえんぴつがでますので、それをクリック。マウスをのせないとえんぴつでないのでご注意ください。上のアナリティクスを選ぶえんぴつをクリックすると、また右からでてくるので、アナリティクスの一番上のやつをクリックしてください。「トラッキングタイプ」と「アナリティクス設定」はそのままでOKです。その下にある「このタグでオーバーライド設定を有効にする」にチェックを入れます。チェックを入れるとアナリティクスのトラッキングコードを入力するボックスが表示されます。ページビューの設定アナリティクスのトラッキングIDの確認方法アナリティクスの管理画面に行って、左下にある「歯車(管理)」を押して、出てきたウィンドウの左から二番目にある「トラッキング情報」をクリックし、「トラッキングコード」を選択してください。トラッキングIDの確認トラッキングIDをコピペUAから始まる、トラッキングIDが表示されるのでそれをコピペします。トラッキングIDをコピーするGTMに戻ってコピペしたトラッキングコードを張り付けてタグの設定は完了です。トリガーの設定GTMの管理画面に戻ってきまして、タグの設定がおわったので、次はトリガーの設定です。トリガーというのは、そのタグは発火する条件です。アナリティクスの場合はページビューで計測するのでページビューでトリガーを設定します。下段にあるトリガーのえんぴつをクリックします。GTMトリガーの設定トリガーの選択画面へ右から出てくるボックスの「+」をクリックします。選択肢の中から「ページビュー」を選択します。トリガーからページビューを選ぶ名前を付けて保存わかりやすい名前を付けて、保存をクリックして、トリガーの設定終了です。わかりやすい名前をつけるここまでで、アナリティクスのタグをGTMで管理する設定が終わりました。画像が多いのと、1個づつ説明しているので、すごくめんどくさい感じると思うんですが、実際にやるとそんなに手間じゃないので安心してください。画面から、項目を選んでポチポチするだけですから。作ったタグをページに埋め込み手順グーグルタグマネージャーのタグをページに埋め込む必要があります。あわせて、アナリティクスのタグがすでに設置済みの場合、それを削除する必要があります。計測がダブってしまうためです。ページに埋め込むタグを取得クリックしたら、計測用のタグが2つ出てきますので、それをページ内に張り付けてください。準備が整ったらGTMの公開ボタンを押すタグの埋め込みと、GTM上の設定が完了しましたら、GTMの管理画面にもどり、「公開」ボタンを押してください!公開ボタンを押さないと動きませんボタンを押して稼働が確認できれば完了です!グーグルタグマネージャーの設置まとめ記事を書いてて思ったんですけどね、最後にこんなこと言うのもあれなんですけど、タグマネージャー、普通に運用している人には不要ですね。入れるメリットあんまりない。アナリティクスでクリックイベントを計測したい場合は、すんごい楽です。GTM入れる前までは自力でイベント作って計測してたんですけど、GTM使うとこんなに簡単に計測できるのかと感動して、記事にしたいなぁと思い、書いたんですけど。GTMの管理画面やタグマネージメントの概念が、結構難しいので、不慣れな初心者の方にはそこまでオススメできるシロモノじゃないと思いました。いった設定とかが苦手じゃなくて、イベント計測したい方にはオススメします。解説まだしてないんだけど。イベント計測に興味がありましたら次の記事もよろしくお願いいたします。GTMを使ってイベント計測を簡単に行う方法GTMのイベントトラッキングを使うことで、設置している広告のクリック数やクリックされたページ、クリックされた商品名が取得できます。data属性をユーザー変数に設定するという少し手間のかかる方法ですが、わかりやすく手順を図解で説明しましたサイト内リンク:https://www.start-point.net/blog/web/seo/gtm2/次の記事はこちらGTMを使ってイベント計測を簡単に行う方法グーグルタグマネージャーを使ってイベントトラッキングを計測する方法の手順を解説。鳥好きWEB制作とWEBマーケティングをやってきました。PHPとMysqlを使って面白いことをやりたいと模索中です。【デジタルマーケターとWeb担当者のためのGoogle&Yahoo!タグマネージャーの教科書】AmazonYahooショッピング楽天GTMの導入オススメ関連コンテンツグーグルタグマネージャーを使ってイベントトラッキングを計測する方法の手順を解説。キーワード選定の方法を考察してみたSEOは結構頑張っていますが、キーワード選定という手法をあまり深く考えたことがなかったので深く考えてみました。SEOで重要なtitleタグとhタグの使い方SEOの内部構造の基本であるTitleタグとHタグの使い方と自分の考えを書きました。カノニカル設定とリダイレクト設定URLの正規化というややこしい話なんですが、SEO上正規化をしておくことは必須項目というべき大事な設定ですブログのアクセスアップに欠かせないSEO的リンク構造の考え方SEOのリンク構造を効果的に作るための情報をまとめました。可能な限り情報の出どころのリンクも用意しております。OGP設定をしてSNSからの流入とCTRを改善するシェアするとき、シェアしてもらうときに最適な形で紹介したいとなるとOGP設定をしっかり設定することが重要ですGTMを使ってイベント計測を簡単に行う方法グーグルタグマネージャーを使ってイベントトラッキングを計測する方法の手順を解説。何がクリックされたかを知ることは大事ですブログアクセスランキングBluetoothイヤホンのペアリング方法とリダイヤル防止策Bluetoothイヤホンのペアリング方法やリモコンの操作方法、リダイヤルの防止策を画像入りで解説します。3.1のレイアウトをデフォルトの状態から、自分好みのレイアウト設定に変更する方法を写真付きで紹介しています。ネットワークオーディオを使わずにPCの音楽を再生する方法パソコンに取り込んだ音楽をせっかくならCDコンポから再生したいと思ったことありませんか?AUXを使った外部接続の方法の紹介です。耳にフィットするイヤーピースを探して、いろいろ検討した結果、SONYのEP-TC50Mを購入しました。α7IIIを片手に東京の夜桜スポットに行ってきました。中目黒と千鳥ヶ淵の夜桜を紹介しながらα7IIIのレビューです。鳥好きWEB制作とWEBマーケティングをやってきました。PHPとMysqlを使って面白いことをやりたいと模索中です。