対象プラン：Miniプラン以上（旧プラン：Starterプラン以上）

Studioサイトでクリックイベントを計測する方法

Google タグマネージャーをStudioと連携させると、Google タグマネージャー上で様々なタグを一括で設定・管理することが可能です。本記事では、Google タグマネージャーを活用し、Googleアナリティクス上でクリックイベントを計測するための設定手順をご紹介します。

Google Tag Managerの専門用語について

用語	説明
タグ	GoogleアナリティクスやGoogle Ads等の外部サービスからのコード。通常はサイトに直接埋め込みますが、GTMを使用することで一元管理が可能になります。
トリガー	クリックやページビューなどのユーザーアクションを定義します。トリガーにより、指定したイベントが発生した時に対応するタグが発火します。

事前準備

設定するにあたり、事前に以下の準備を行なってください。

Point:

画像は本記事作成当時のものとなり、現在の仕様とは異なる可能性があります。

※ タグマネージャー公式ヘルプを参考に解説しています。

新規タグの追加 Google タグマネージャーで、[タグ] > [新規] をクリックします。
タグの設定
任意の名前をタグに設定します。[タグの設定] ボックスで [Google タグ] を選択し、[タグ ID] に「G-」形式の ID を入力します。

タグIDは GA4の管理画面から取得します。 [管理] の [データの収集と修正] で、[データストリーム] をクリックします。詳細を開くと右上に測定IDが表示されるのでこれをコピーして使います。
トリガーの作成
[トリガー] をクリックし、[初期化 - すべてのページ] トリガーを選択します。最後に「保存」をクリックし、タグの設定を保存します。
※トリガーについて詳しくは、ページトリガーの公式記事をご覧ください。
タグの動作確認
[プレビュー] をクリックし、Tag Assistant を開きます。サイトの URL を入力します。

タグが正常に配信されると、「配信されたタグ」に表示されます。

※ タグマネージャー公式ヘルプを参考に解説しています。

新規タグの追加 Google タグマネージャーで、[タグ] > [新規] をクリックします。
タグの設定
タグに任意の名前を設定します。次に、以下を設定します。
- [タグの種類] は [Google アナリティクス: GA4 イベント] を選択。
- [測定 ID] には、「2. タグの設定」の手順でGA4の管理画面から取得した同じIDをペーストします。
- [イベント名] には、任意のイベント名を入力します。　
トリガーの作成
イベントを送信する条件を指定できます。
[トリガー] をクリックし、右上の [+] をクリックします。トリガー名を設定します。

以下を設定します。
- 最後に、画面右上の [保存] をクリック
- トリガータイプを[クリック > すべての要素]
- このトリガーの発生場所を [一部のクリック] で、[Click Element] [CSSセレクタに一致する] [#cv-0001, #cv-0001 *] を入力します。（cv-0001 は任意の文字列で設定してください）
タグの動作確認
[プレビュー] をクリックし、Tag Assistant を開きます。公開サイトの URL を入力します。
タグが正常に配信されると、「Tags Fired」に表示されます。