前回の記事で、CocoonでGA4(Google Analytics 4)を設定する方法を紹介しました。
CocoonにGA4を設定する方法は下記の2通りあります。
- GA4の測定IDを設定する方法
- GoogleタグマネージャーのIDを設定する方法
前回の記事では①を紹介しましたが、今回は②の手順を紹介します。
Googleタグマネージャー(GTM)とは？
Googleタグマネージャーのメリット
Googleタグマネージャーについてざっくりと説明します。
Googleタグマネージャー(GTM)はGoogleが提供しているタグ管理サービスです。
Google AnalyticsやGoogle広告などをWebサイトに導入する際、Webサイトにそれぞれのタグを埋め込まなければいけませんが、GTMを利用するとHTMLを直接編集することなくそれら複数のタグを一元管理できるようになります。
Webサイトを運営していると新しいタグの追加、不要なタグの削除、タグの更新などの作業が必要になってきますが、その度にHTMLを編集するのは手間がかかりますし、どこに何のタグを埋め込んだかわからなくなってしまうなんてこともありますよね。そんな煩雑なタグ管理のお悩みを解決してくれるサービスです。
また、GTMにはプレビュー機能がついているので、タグが正常に動作しているか・エラーが起きていないかを公開前にチェックできます。もしもタグ公開後にエラーが起きてしまっても、GTMはバージョン管理が可能なので、バージョンを戻すことで即座にサイトを前の状態に復元できるのもメリットになります。
WebサイトにGA4しか必要なく今後も他のタグを埋め込む可能性がないのならGTMを使うメリットは薄く逆に手間が増えてしまいますが、そうでないなら使用を検討してみると良いかもです。
Googleタグマネージャー利用時の注意点
既にWebサイトにGA4タグを埋め込んでいる場合、GA4を設定したGTMタグも埋め込んでしまうと二重計測になってしまいます。GTMでGA4を設定する場合は、既にサイトに埋め込んだGA4タグを削除することを忘れないでください。
なお、Cocoonでは二重計測を防ぐためにGTMとGA4タグの両方を設定した場合にはGTMの方が優先されるようになっています。
Google Analyticsのアカウントを作成する
Google Analyticsにアカウントがない場合は、アカウント作成から始めます。既に作成済みの方はこの手順を飛ばしてください。
Google Analyticsにアクセスして、「測定を開始」をクリックしてください。
アカウント名にご自身が管理しやすい任意の名称を入力します。「アカウントのデータ共有設定」の部分はデフォルトのままでOKです。「次へ」をクリックします。
「プロパティ名」には計測対象の名称を入れます。サイト名が分かりやすいと思います。「レポートのタイムゾーン」と「通貨」はご自身の地域を選択して、「次へ」をクリックしてください。
「業種」と「ビジネスの規模」に当てはまりそうなものを適当に選択して「次へ」をクリックします。
ビジネス目標をお好みで選択して「作成」をクリックします。
Google Analyticsの利用規約が表示されるので、お住まいの地域を選択し、チェックを入れてから「同意する」をクリックします。
プラットフォームの選択をします。今回はwebサイトなので「ウェブ」を選択します。
データストリームの設定をします。サイトのURLを入力し、ストリーム名(任意の名称)をつけてください。入力後、「作成して続行」をクリックします。
今回はGTMを使用するので、Googleタグの設定ページは閉じて大丈夫です。ただ、Googleタグ中の画像赤枠の値が測定IDなので、後で使えるようにコピペやメモをしておくと良いでしょう。
上で測定IDを忘れても大丈夫です。Googleタグの設定画面を閉じると下の画面が表示されるはずなので、そちらでも測定IDはコピペできます。
Googleタグマネージャーのアカウントを作成してCocoonに設定する
Googleタグマネージャーのアカウントを作成します。
Googleタグマネージャーにアクセスして、「無料で利用する」をクリックします。
「アカウントを作成」をクリックします。
「アカウントの設定」と「コンテナの設定」をします。GTMにはアカウントとコンテナという概念があり、1つのコンテナに1つのサイト(アプリ)を設定し、それらコンテナを管理するのがアカウントというイメージになります。
「アカウント名」にはGTMのアカウント名、「コンテナ名」にはサイト名やアプリ名を入力し、「ターゲットプラットフォーム」は今回はウェブサイトを解析するので「ウェブ」を選択してください。入力したら「作成」をクリックします。
利用規約が表示されるので目を通して問題なければ「はい」をクリックします。
「Googleタグマネージャーをインストール」という画面が表示されますが、今回はCocoonの機能を利用してタグを入れるのでこの画面は閉じてOKです。
メニューの「管理」をクリックし、表示された画面赤枠部分にGTMのIDが表示されています。このIDを次で使用します。
WordPressの管理画面にアクセスして、メニューから「Cocoon設定」→「Cocoon設定」に進みます。タブの「アクセス解析・認証」をクリックして、「Googleタグマネージャ設定」の「タグマネージャID」のところにGTMのIDをコピペしてください。「変更をまとめて保存」をクリックしてCooconのGTM設定は完了です。
GoogleタグマネージャーにGA4を設定する
GA4とGTMのアカウントを作成したら、GTMにGA4を設定します。GA4を設定したいコンテナが選択されてるか確認し、GTMのメニューから「タグ」を選択して「新規」をクリックしてください。
左上にタグの名称を入力します。GA4のタグであることがわかりやすい名称を任意につけてください。次に「タグの設定」をクリックします。
タグタイプの選択画面が出るので、「Googleアナリティクス」を選択します。
「Googleタグ」を選択します。
「タグID」のところにGA4の測定IDをコピペします。次に「トリガー」の設定をクリックしてください。
トリガーの選択は「初期化」を選択します。トリガーとはタグを配信させる(発火させる)条件のことです。「初期化」にしておくとページ内の他のどのタグよりも前に発火させることができます。
タグとトリガーの設定が完了したら右上の「保存」をクリックします。これでGTMとGA4の連携が完了です。
プレビュー後、公開する
設定に問題等がないか、プレビュー機能で確認することができます。画像赤枠にある「プレビュー」をクリックしてください。
ご自身のURLを入力して、「Connect」をクリックします。
接続できたら「Connected!」と表示され、GTMに下記のような表示が出ます。「Tags Fired」に設定したタグが表示されていたらOKです。もし「Tags Not Fired」に表示されていたらタグが正しく動作していないので設定を見直してください。
プレビューで問題がなければタグを公開します。画像赤枠の「公開」をクリックしてください。
送信設定で「バージョン名」と「バージョンの説明」を入力します。GTMではバージョン管理が可能で、例えば今回GA4のタグを追加したのがバージョン1だとして、次に何かタグを追加したり編集した時の設定をバージョン2として保存することができます。バージョン2で不具合が発生した場合はバージョン1に戻すことが可能なのでトラブルに対処しやすく、過去の作業も確認しやすいです。
「バージョン名」と「バージョンの説明」はどんな設定を行ったのかわかりやすい名称をつけるのがおすすめです。入力したら「公開」をクリックします。
バージョンの概要などの画面が表示されたら公開完了です。公開を忘れると設定が反映されませんのでご注意ください。
GA4で計測を確認する
設定・連携が完了したら、GA4にログインしてちゃんと測定されているかレポートをチェックしましょう。但し、データが反映されるのに24～48時間かかるので、時間をおいてからレポートを確認してみて下さい。
まとめ
タグを埋め込むのにHTMLを直接編集するのが億劫だったり、複数のタグを埋め込んでいる場合にはGTMは便利だと思います。使用する際には、二重計測と公開忘れにはお気を付けくださいね。
