GTMを利用したGA4設定方法を初心者向けにわかりやすく解説|東京のWEB制作会社・ホームページ制作会社|株式会社GIG

GTMを利用したGA4設定方法を初心者向けにわかりやすく解説

2023-01-05 制作・開発

こんにちは、株式会社GIG メディア事業部 マネージャーの黒木です。

アクセス解析に携わる担当者なら誰もが一度は使用したことがあるGoogleアナリティクス。これまで私たちはユニバーサルアナリティクス(UA)と呼ばれるバージョンを活用してきましたが、ついに2023年6月末にUAでの計測が終了してしまいました。いますぐにGoogleアナリティクス4(GA4)に完全移行する必要があります。

GA4の導入や運用はGoogleタグマネージャー(GTM)を活用する方法が最も効率的ですが、そもそもGTMに不慣れな担当者も多いため、対応を進めるのが不安ですよね。

この記事では、GTMを活用したGA4の導入方法やイベント計測の設定方法を画像付きで解説します。「Googleアナリティクスの導入自体が初めてで、何から始めたらいいのか分からない」という方は、GA4の導入方法とは? 初心者向けに基本設定をわかりやすく画像で解説の記事もあわせてご活用ください。

また、株式会社GIGでは、GTM/GA4の導入サポートが可能です。計測体制の構築からご担当することもできますので、データ分析・アクセス解析にお悩みの方はぜひ一度お問合せください。

Googleアナリティクス4(GA4)とは

Googleアナリティクスとは、2005年にGoogleから提供されているアクセス解析ツールです。2012年にクロスドメイン・クロスプラットフォームで計測可能なUAがリリースされ、2020年にWebサイトとアプリを横断的にトラッキングできるGA4がリリースされました。

UAとGA4の大きな違いは、計測軸が変わることです。

UAはページに対するセッションを重要視した計測になっていましたが、GA4ではユーザーの行動(=イベント)を軸に計測する仕様になっています。そのため、複数デバイスを使用しているユーザーや、サイト・アプリを横断しているユーザーの行動をより具体的に分析できます。

Googleタグマネージャー(GTM)とは

Googleが無料で提供しているタグマネジメントツールです。

サイト分析に必要な計測タグや、広告配信に必要な広告タグを実際に利用して数値を計測するためには、計測対象となるWebサイトのhtmlに設置する必要があります。

ただし、この従来の方法ではタグを更新したり削除するたびにタグを埋め込んだページのhtmlを一つずつ編集する必要があり、管理の手間が増えがちでした。

GTMは、オンラインの管理画面上でタグの編集・管理を行えるようにしたツールになっています。

GA4導入やイベント計測でGTMを活用する4つのメリット

GA4の導入方法は主に2つで、直接htmlコードを編集する方法とGTMで管理する方法があります。なぜGTMの活用が推奨されるのか、4つのメリットを紹介します。メリットに魅力を感じた場合は、ぜひこの記事を参考にしながらGA4の導入にチャレンジしてくださいね。

メリット1. タグをGTM上で一括管理できる

通常、タグは計測したいページ一つひとつのhtmlに直接貼り付ける必要があります。もちろん、使用するタグを更新したり追加する場合は、その都度全ページのhtmlを編集しなければいけないため手間がかかります。

GTMであれば、導入時のみ計測対象ページの全てにGTMコードを貼り付ける必要がありますが、それ以降のタグ設定はhtmlを編集する必要がなく、GTM上で設定や反映を行うことが可能です。

また、どのページにどのタグが設置されているのか視覚的に確認することもできるため、タグの数が増えても管理しやすいというメリットがあります。

メリット2. タグ設定の修正や復元が簡単

新たに設定したタグにミスや不具合が生じ、思うような計測ができなくなることもあります。手動でタグを管理していた場合、当然ですが一つひとつ不具合が生じる前のタグ設定に戻す必要があります。

GTMであれば「バージョン」ごとにタグの設定を行えます。

作業後に正常に作動しなかった場合は、管理画面上から前のバージョンに戻すことですぐに元の設定で計測を継続できるため安心です。

メリット3. 他の管理者や、担当者との共有も安心して実施できる

GTMを導入していれば、広告代理店や制作会社といった外注先にタグ編集を安心して依頼できます。

htmlを編集する方法でタグ設置や更新を依頼する場合、サイト管理画面のログイン権限を付与する必要がある上に、タグ設置以外の箇所を誤って編集するといった万が一のリスクを排除できません。

GTMであればタグ設置に必要な編集機能のみを共有できるため、最低限の共有で必要な作業を過不足なく依頼できます。

また、社内のWeb担当者が変更になった場合も、設置されているタグの情報がすでにGTM上で整理されているため、引き継ぎ作業がスムーズに進められるという点でも便利です。

メリット4. GA4計測を想定したタグがデフォルトで用意されている

GA4もGTMもGoogleが開発したツールです。互いに連携して利用することが想定されているため、複雑な設定もなく使いやすいです。

GA4を導入するためのタグと、イベントを設定して計測するためのタグがGTMで用意されているため、作業に慣れればhtmlを編集することなく、イベント設定を数分〜数十分ほどで追加することも可能です。

GTMを利用してGA4を導入するまでの4ステップ

GTMでGA4を導入するためには「GA4のプロパティ作成」と「計測対象サイトへのGTMタグ設置」の2つをあらかじめ済ませる必要があります。まだお済みでない方はGA4の導入方法とは? 初心者向けに基本設定をわかりやすく画像で解説の記事にて詳細なやり方を解説しています。

以下では2つの準備が完了している担当者向けに、GTMを活用したGA4の導入方法を解説します。

ステップ1. GA4上で「測定ID」をチェックする

計測開始に必要な初期設定が完了していない場合、GA4を開くと以下のように「タグの設定手順を確認」というボタンが表示されます。

GA4計測ID

クリックするとストリームの詳細が表示されます。測定IDは次のステップで使用するため、コピーしましょう。

ウェブストリーム詳細

なお、すでにGA4で他のサイトの計測を行っているなどの理由で「タグの設定手順を確認」のボタンが表示されないことがあります。その場合は、GA4の左端下部にある管理メニュー(歯車マーク)を選択し、プロパティ配下の「データストリーム」>「ウェブ」から計測対象のサイトをクリックすることでストリームの詳細を確認できます。

管理画面からストリームの詳細を確認する画面

ステップ2. GTM上で「GA4設定」のタグを作成する

GTMの管理画面を開き、「ワークスペース」タブを選択します。
左端の「タグ」をクリックしたら右上の「新規」をクリックします。

GTMtタグ新規作成

「タグの設定」が表示されたらクリックして、タグタイプの中から「Googleアナリティクス:GA4設定」を選択します。

GTMのGA4設定タグ

選択すると測定IDの記入を求められます。ステップ1. でコピーした測定IDをペーストしましょう。

その後、下にある「トリガー」をクリックし、測定対象ページとして「ALL Pages」を設定します。

トリガーの設定

これで最低限のタグとトリガーが設定されたため、右上の「保存」をクリックします。

GTMタグ保存

ステップ3. GTMタグが発火(=正常に作動)するか確認する

プレビュー機能を活用することで、タグが問題なく設定できているか確認できます。タグマネージャーのワークスペース>タグの右上に「プレビュー」ボタンがあるため、ここをクリックします。

GTMタグプレビュー

先ほど作成したタグの計測対象になるサイトのURLを記載し、「Connect」ボタンを押します。

GTMプレビューサイト接続

ボタンを押すと、別タブでURLを入れたサイトが表示されるため、元のタブを開きます。元のタブにはプレビュー結果が表示されており、ページを開いた時にタグが問題なく作動しているかを確認できます。

「Tags Fired」に分類されていれば問題なく設定できており、「Not Fired」に分類されている場合はなんらかの設定を間違えているため、見直す必要があります。

問題なくタグが発火していることを確認したらワークスペース>タグの画面に戻り、「公開」ボタンを押します。公開ボタンを押さないと計測が開始されないので注意が必要です。

ステップ4. GA4上でアクセス計測できているか最終確認を行う

GTMでGA4設定タグの公開まで対応したら、最後にもう一度GA4を開きます。

左メニューから「レポート」を選択し、「リアルタイム」を開きます。

このタイミングで担当者が実際に計測サイトへアクセスし、GA4上の「過去30分間のユーザー」に反映されているか確認します。問題なく数値が反映されていればGA4の導入は完了になります。ここまでの設定でトラフィック数など基本的なデータの確認ができるようになっています。

GA4リアルタイム概要

【基本】GTMでイベント計測するための設定3ステップ

GA4がデフォルトで計測できるイベント以外にも、サイト運用の目的や狙いに応じて、別途イベントを定義して分析するケースも考えられます。

ここからはGTMを活用して「カスタムイベント」を計測するための方法を紹介します。

イベント設定をしなくてもGA4で自動計測されるイベント

以下のイベントはデフォルトで計測されるため、カスタムイベントで設定する必要がありません。似たようなイベント計測が重複しないよう、設定前に一度確認しましょう。

より詳細な条件を設定して計測したい場合は、カスタムイベントを設定しましょう。

イベント
トリガーのタイミング
パラメータ

click

ユーザーが現在のドメインから移動するリンクをクリックするたび。

パラメータは収集されません

file_download

ユーザーが次のタイプの(一般的なファイル拡張子の)ファイルに移動するリンクをクリックするとき。

・ドキュメント
・テキスト
実行可能
・プレゼンテーション
・圧縮ファイル
・動画
音声

file_extension、file_name link_classes、link_domain、link_id、link_text、link_url
first_visitアナリティクスが有効になっているウェブサイトや Android Instant Apps に、ユーザーが初めてアクセスしたとき、またはこれらを起動したとき。
page_viewページが読み込まれるたび、またはアクティブなサイトによって閲覧履歴のステータスが変更されるたび。page_location(ページの URL)、page_referrer(前のページの URL)、engagement_time_msec
scrollユーザーが各ページの最下部まで初めてスクロールしたとき(垂直方向に 90% の深さまで表示されたときなど)engagement_time_msec
session_startユーザーがアプリやウェブサイトを利用したとき
user_engagementアプリがフォアグラウンド表示されているとき、またはウェブページが 1 秒以上フォーカスされているとき。engagement_time_msec
video_complete

動画が終了したとき。
(JavaScript API サポートが有効になっている埋め込み YouTube 動画の場合。以下同様)

video_current_time、video_duration、video_percent、video_provider、video_title、video_url、visible(ブール値)
video_progress動画が再生時間の 10%、25%、50%、75% 以降まで進んだとき。video_current_time、video_duration、video_percent、video_provider、video_title、video_url、visible(ブール値)
video_start動画の再生が開始されたとき。video_current_time、video_duration、video_percent、video_provider、video_title、video_url、visible(ブール値)
view_search_resultsユーザーがサイト内検索を行うたびに記録され、URL クエリ パラメータが含まれているかどうかで示される。「search_term」と、必要に応じて「q_<additional key="">」

※引用:【GA4】自動的に収集されるイベント|アナリティクスヘルプ

ステップ1. 「GA4イベントタグ」を設定する

GTMのワークスペースからタグを選択し、「新規」ボタンで「GA4イベントタグ」を選びます。

GA4イベントタグ

タグの設定では、タグの種類と設定タグ、イベント名を設定します。
この章では「特定のCTAボタンをクリックした回数」を計測するイベントを設定すると仮定し、下記のように記入します。

タグの種類:GA4イベント
設定タグ:GA4導入時に作成した「GA4設定」タグを選択。

イベント名:計測するイベントがわかるように、任意のものを設定。ただし、デフォルトのイベント名や他のイベント名と被ると計測データが混在する恐れがあるため、区別しやすい命名規則を社内で決めておくと管理が楽です。

GTMイベントタグ設定

ステップ2. トリガーを設定する

カスタムイベントのトリガーは新規で作成する必要があります。

右上の「+」ボタンを選択します。

トリガー設定

詳細にルールを設定する画面が表示されるため、計測したいイベントに適した設定を行います。今回はCTAボタンのクリック数を計測するカスタムイベントを想定しているので、トリガータイプは「クリック-リンクのみ」を選択します。

トリガーのタイプ選択

CTAがクリックされたら計測されるようなトリガーの設定は以下のようになります。

タグの配信を待つ:チェックを入れた場合、指定時間の範囲内でタグが配信されるまでリンクが開くのを待機させることが可能(任意)。

トリガーの発生場所:「一部のリンククリック」にした上で、計測対象となるイベントの条件を設定。今回は計測対象のCTAボタンで設定されている「リンク先URLをクリック」した場合に発火するようにしています。

トリガーの設定

ステップ3. 問題なくタグが発火しているか確認し、公開する

プレビュー機能を利用して確認します。やり方はGA4導入タグを設定した時と同じです。

正常に作動していることを確認したら、こちらも忘れず「公開」を押し、計測を開始します。

【実践】代表的なイベント別・トリガー設定方法

GTMでイベントを設定する方法は先述の通りですが、ここからは分析の現場でよく採用される、イベントごとにトリガーを設定する例をご紹介します。カスタムイベントの設計に不慣れでサンプルを参考にしたい!という担当者の方はぜひご覧ください。

ケース1. 特定のページビューをカウントしたい(資料請求完了ページなど)

問い合わせ完了ページや資料請求完了ページなど、特定のアクションを完了させたユーザーが遷移したページをコンバージョン数として計測したい場合は、「ページビュー」のトリガータイプで設定する必要があります。

各種資料の請求が完了した後に遷移するページのURL末尾に、共通して「/document/complete?white-paper」が入る場合、「Page URL」に「/document/complete?white-paper」を含むものを「一部のページビュー」の条件に設定することで計測可能です。

資料DL計測向けトリガーの設定

ケース2. ページのスクロール率を詳細に設定したい(メディア記事など)

ページのスクロール率はデフォルトで計測されていますが、こちらはページの90%をスクロールした場合のデータになります。

記事コンテンツを掲載するメディアのように、ユーザーの読了率をより詳細に把握したい場合はカスタムイベントで別途設定することが可能です。

例えば特定の記事の半分(50%)まで読んでいるユーザーの割合を把握したい場合は、トリガーのタイプを「スクロール距離」にします。

「縦方向スクロール距離」の「割合」を「50」に設定し、計測対象のページの定義を設定すればOKです。

スクロール定義

ケース3. 特定のクリック数を計測したい(電話番号など)

GTMのイベント設定の例として、CTAのような特定のリンクボタンのクリック数を計測する設定を紹介しましたが、直接サイトから電話の発信が可能なサイトであれば、電話番号のクリックを同様に計測することも可能です。

トリガータイプとトリガーの発生場所は、それぞれ「クリック-リンクのみ」「一部のリンククリック」を選択します。

サイトから直接電話をかけられるサイトの多くは<a> 要素の href 属性で「href="tel:1234567890"」といった形でリンク設定がされています。

そのため、トリガーを配信する条件では「Click URL」を選択し、「電話番号」を「含む」設定にすることで計測可能です。電話番号計測設定

GTMを利用するGA4の初期設定でよくある不具合や疑問

ここまで紹介した方法に沿ってGA4やGTMの初期設定を進めてたものの、思うように計測ができないといった不具合が生じた場合にチェックしたい事柄を項目ごとに紹介します。

不具合. GTMを活用してGA4の設定を進めたが、計測データが反映されない

このようなケースの場合、考えられる原因は以下のようなものが考えられます。初歩的な部分で見落としているケースが多いため、複数の担当者でダブルチェックを行うのも有効的です。

・GTMタグは計測対象のWebサイトの全てのページ/正しい箇所に設置されていますか?
・UAのプロパティからGA4のプロパティを開設した時に、GA4タグを別途設置しましたか?(現在使用しているUAタグではGA4の計測はできません)
・作成したGTMタグの「公開」ボタンを押しましたか? 保存しただけでは計測できません。
・GA4の測定IDは正しく記載されていますか? 転記ミスを防ぐためにコピペしましょう。

疑問1. UAタグはhtmlで直接設置しているが、GTMタグを設置しても問題ない?

以前からGoogleアナリティクスを活用している企業に多い疑問です。

結論から言うと、新たにGTMタグを設置しても問題ありません。

ただし、htmlに直接設置されているタグとGTMで管理しているタグが混在している状態は、管理の手間がかかる上に、二重計測のリスクも高まります。

このタイミングでサイトに設置されているタグを全て洗い出し、今後も施策で必要なタグはなるべくGTM上で全て管理できるように整理するのがおすすめです。

疑問2. GA4の導入は自社対応と他社依頼、どちらが良い?

社内にGA4やサイト分析に関する知見が豊富で、イベントやコンバージョンの要件定義も問題なくできる!という担当者がいる場合は、自社でGA4やGTMの初期設定を進めるのが最もスムーズでしょう。

ただし、ノウハウが少ない企業や、サイト規模が大きく管理が大変、Web担当を兼務していて稼働リソースに余裕がないといった場合、自社で対応を進めようとすると想定以上に時間がかかり、GA4に完全移行する2022年7月までに間に合わない恐れも。移行後のアクセス分析業務に支障が出るのはなんとしても避けたいところですよね。

このように、社内の対応では限界がある、移行後の分析を見据えて綿密なイベント設計が必要といった企業は、GA4やWeb分析に詳しい企業に依頼するのが安心です。

GTMを利用したGA4移行のご相談はGIGへ

以上、GTMを利用したGA4の導入方法やイベント設定方法を解説しました。

GA4は「イベント」を単位とした分析ツールになるため、自動計測されるイベントに加え、計測目的に合わせたカスタムイベントも活用することでよりユーザーの分析を詳細かつシームレスに行うことが可能です。

とはいえ、「社内にノウハウのある担当者がいないからGTMの設定が不安……」という悩みを持つ企業様も多いです。

株式会社GIGではWebマーケティング支援の一環として、GTMを活用したGA4移行のご相談も承っています。GA4導入後のイベント設計やサイト分析業務のサポートなども可能です。

お困りの担当者はぜひお問合せください。

■株式会社GIG
お仕事のお問い合わせはこちら
会社紹介資料のダウンロードはこちら
採用応募はこちら(GIG採用サイト)
採用応募はこちら(Wantedly)

■Webマーケティング支援事例
Chatwork - サービスサイト制作 / マーケティング支援
SmartNews - サービスサイト制作 / マーケティング支援


WebやDXの課題、お気軽にご相談ください。

黒木 鈴華

メディア事業部 マーケティングメディアチーム シニアエディター。1996年生まれの早稲田大学社会科学部卒。学生時代よりライターとしてコンテンツSEOに携わる。新卒入社から数社を経験した現在に至るまで一貫してコンテンツディレクターとしてオウンドメディア運用支援に従事。前職では役員就任も経験。