対象プラン：Miniプラン以上（旧プラン：Starterプラン以上）
注意： Apps連携との二重計測に注意してください
StudioのApps連携でGoogleアナリティクスをすでに設定している場合、GoogleタグマネージャーでもGAタグを設置すると二重計測が発生します。GAタグの配信はどちらか一方に統一してください。
Googleタグマネージャーの用語
用語 | 説明 |
タグ | GoogleアナリティクスやGoogle広告などの外部サービスのコードです。通常はサイトに直接埋め込みますが、Googleタグマネージャーを使うと一元管理できます。 |
トリガー | クリックやページビューなどのユーザーアクションを定義します。指定したイベントが発生したとき、対応するタグが発火します。 |
事前準備
設定前に、Apps連携でGoogleタグマネージャーを連携してください。
設定手順
注意：記事内のGoogleタグマネージャーの画面は、Google側の仕様変更などにより実際の画面と異なる場合があります。
手順1. GA4 設定タグを作成する
※ タグマネージャー公式ヘルプを参考に解説しています。
Googleタグマネージャーで、[タグ] > [新規] をクリックします。
タグに任意の名前を設定します。[タグの設定] ボックスで [Googleタグ] を選択し、[タグID] にGA4の測定ID（「「G-」形式の ID）を入力します。
測定IDはGA4の管理画面から取得します。
（Apps連携：Googleアナリティクスを連携する の手順も参考にしてください）
[トリガー] をクリックし、[初期化 - すべてのページ] トリガーを選択します。
※トリガーについて詳しくは、ページトリガーの公式記事をご覧ください。
[保存] をクリックしてタグを保存します。
[プレビュー] をクリックしてTag Assistantを開き、サイトのURLを入力します。
タグが正常に配信されると、「配信されたタグ」に表示されます。
手順2. GA4 イベントタグを作成する
※ タグマネージャー公式ヘルプを参考に解説しています。
Google タグ マネージャーで、[タグ] > [新規] をクリックします。
タグに任意の名前を設定し、次の項目を設定します。
[タグの種類] ：[Google アナリティクス: GA4 イベント] を選択
[測定 ID] ：手順1で取得した測定IDを入力
[イベント名] ：任意のイベント名を入力
[トリガー] をクリックし、右上の [+] をクリックしてトリガーを新規作成します。
トリガーに任意の名前を設定し、次の項目を設定します。
[トリガータイプ]：[クリック > すべての要素] を選択
[このトリガーの発生場所]：[一部のクリック] を選択し、[Click Element] [CSSセレクタに一致する] [
#cv-0001, #cv-0001 *] を入力（cv-0001は任意の文字列で設定）※トリガーがうまく発火しない場合は、[すべての要素] を [クリックのみ] に変更して再度確認してください。
[保存] をクリックしてトリガーとタグを保存します。
[プレビュー] をクリックしてTag Assistantを開き、公開サイトのURLを入力します。
タグが正常に配信されると、「Tags Fired」に表示されます。
手順3. 変更した作業を公開する
画面右上の [公開] をクリックします。
バージョン名などを入力し、公開します。
手順4. StudioでIDを設定する
IDを設定したいボックスを選択します。
[ID]欄に、手順2のトリガーで設定した文字列を入力します。
公開済みのサイトを編集していた場合は、サイトを更新します。この操作を行うまで、公開サイトへは反映されません。
5. 動作確認をする
Googleアナリティクスのリアルタイムレポートで動作を確認します。公開サイトでIDを設定した要素をクリックし、レポートにイベントが記録されているか確認します。
うまく動作しない場合は、次の点を確認してください。
Googleタグマネージャーでバージョンの公開が完了しているか
ブラウザの拡張機能がタグの発火に干渉していないか（拡張機能をオフにして再度試す）
StudioでIDを設定した後、サイトの更新が完了しているか
グーグルタグ Google Tag Manager