ツール・サービス

GoogleタグマネージャーでGA4を導入する方法

GoogleタグマネージャーでGA4を導入する方法 ツール・サービス

こんにちは!テダスクのSeitoです。

いよいよ今月末でGoogleユニバーサルアナリティクスの測定が止まり、GA4への移行が急がれる状況となってきまして、お客様の対応をしているところです。

そういった中で、私のサイトではタグマネージャーを使わないでGA4を導入する方法を公開していますが、コンバージョン測定(お問い合わせ官僚などのゴール設定)が必要な場合は、どうしてもタグマネージャーを使った方が使い勝手が良いため、改めてタグマネージャーによるGA4の導入方法を共有したいと思います。

もしコンバージョン設定など不要な場合はより簡単なタグマネージャー無しでGA4で実装する方法も参考にしてみて下さい。

WordPressにタグマネージャーを使わないでGoogleアナリティクス4(GA4)を実装する方法 | TEDASK(テダスク)-埼玉県川口市のWEB制作事務所
カスタムイベントが不要という場合、例えばどのくらいのユーザーが自分のサイトを閲覧しているか、どういった経路で自分のサイトに来ているかなど、一般的な計測で十分という場合は逆にタグマネージャーは不要です。そのため、従来のGoogleアナリティク...

ちなみに、まだGA4のプロパティを作っていない場合は、ユニバーサルアナリティクスの「設定アシスタント」からGA4に移行するための設定を完了してGA4のプロパティを作成してからこの後の作業を行って下さい。

タグマネージャーにアカウントの追加とコンテナの追加とコードの実装

まずはGoogle検索で「Google tagmanager」と検索して、タグマネージャーのサイトに入ります。

「アカウントを作成」をクリックします。

アカウントの設定画面が表示されますが、これはサイト名ではなく今から作るアカウントで複数サイトを管理することになりますので、会社名や屋合名など代表的な名前を入力されると良いです。

また、コンテナ名がサイト名にあたるものなので、ドメインでも良いですしサイト名でも良いと思います。

ターゲットプラットフォームは今回はホームページなので、ウェブを選びます。

最後に「作成」をクリックします。

利用規約が表示されますので、「GDPR で必須となるデータ処理規約にも同意します。」にチェックを入れて、「はい」をクリックします。

すると、ダイアローグでタグマネージャー実装用のコードが表示されますので、説明のとおり<head>タグの上の方にと<body>開始タグ直後にコードを埋め込みます。

このコードですが、もし子テーマをお使いの場合やオリジナルテーマの場合は、テンプレートファイルのheader.phpなどに直接書き込んでいいのですが、もし親テーマの場合はテーマ更新時に上書きされて消えるリスクがあるため、プラグインを使うなど工夫しましょう。

また、有料テーマの中にはタグマネージャーのGTM-から始まるコードを入れて実装するテーマや、タグマネージャー用のコードを入れられるようになっているテーマもありますので、お使いのテーマの公式サイトでタグマネージャーの実装について確認してみましょう。

今回は、WordPress公式テーマのTwenty Twenty-Oneの子テーマという想定で、私のサイトに実装してみたいと思います。

テーマのheader.phpに実装してみました。

以上、Googleタグマネージャーのサイトへの実装はこれで完了になります。

Googleアナリティクス4(GA4)を動作させる設定

今度はタグマネージャー側でGA4と連動する設定をして、アナリティクス計測を出来るように設定していきます。

タグマネージャートップページで、「新しいタグをクリック」します。

タグの名前を何でも良いのですが、何のタグか分かるように今回は「GA4測定タグ」と記入しました。そして「タグの設定」をクリックします。

右からスライドでダメニューが表示されますので「Googleアナリティクス:GA4設定」をクリックします。

次に「測定ID」にGoogle GA4ので測定対象のサイトの測定IDを入力しますが、その測定IDはどこにあるかというと、プロパティの「データストリーム」というメニューで確認出来ます。

GA4のプロパティ画面でGA4を選んでいることを確認して「データストリーム」のメニューをクリックします。

表示されたサイト名をクリックします。

そうすると、測定IDが表示されますので、このコードをコピーしておきます。

そしてタグマネージャーの画面に戻り先程コピーした測定IDを入力欄に貼り付けます。

次に「トリガー」をクリックします。

また右からメニューが表示されますので「Initialization – All Pages」をクリックします。

この状態で右上の「保存」をクリックします。

これでGA4の測定用タグの作成が完了しました

タグ作成が終わったら必ず「公開」をすること

次に先程作成したGA4の測定用タグを有効にするために、「公開」をします。

タグマネージャーは測定タグを作っただけでは有効にならないため、忘れずに公開を行います。

右上の「公開」をクリックします。

タグを有効化するために公開をしますが、この公開を記録するためにバージョン名とバージョンの説明を記入します。

今回の場合はGA4の測定用のタグ作成なので、それが分かる様な名前と説明を入力して、「公開」をクリックして設定を完了します。

そうすると、今回の設定内容について記録が残ってその確認画面が表示されますので、確認したら左上の×をクリックして終了します。

公開中となればOKです。

まとめ

今回はタグマネージャーでGA4を測定するためのタグを作成して、有効化まで行いました。

次回は、お問い合わせフォームや特定のリンクのクリックイベントを取得する方法を共有したいと思っています。

もし自分では難しいと言うかたは、お気軽にお問い合わせください。

以上、「GoogleタグマネージャーでGA4を導入する方法」でした。

タグマネージャーとGA4の設定をお願いする

この記事を書いた人
Toshi Seito

TEDASK代表
WordPressに関する相談実績のべ300件以上、タイムチケットでのWordPressの立ち上げお手伝いのチケット販実績240件以上!WordPressのカスタマイズから、WEBサービス制作、ホームページ制作のご相談はお任せ下さい。

Toshi Seitoをフォローする

コメント

タイトルとURLをコピーしました