「フォーム送信完了」を計測する際はフォーム送信が完了したあとに表示されるページのURLの表示を計測する設定をすることが多いです。
しかし、サイトに設置している「お問い合わせフォーム」や「申し込みフォーム」で、送信が完了したあとに「完了ページに遷移しない」場合があります。
今回はGoogleタグマネージャーを使用して「完了ページに遷移しない」ケースでのフォーム送信回数を計測する方法を解説します。
方法はいくつかありますが、この記事では「フォーム送信ボタン」のクリックを計測する方法です。
設定の手順
この手順で設定していきます。
- 変数
- トリガー
- タグ
- タグの作動をテストする
では、進めましょう。
１．変数の設定
Googleタグマネージャーのワークスペースの左側メニューにある「変数」をクリックします。
右上の「設定」をクリックします。
すでにいくつか変数が設定されているかもしれません。
右から画面が開いたら「クリック」の項目の変数をすべてチェックします。
変数はチェックを入れるだけで設定されますので、このまま右側の画面は閉じてかまいません。
これで変数の設定は完了です。
ちなみにここで設定した各変数は下記の要素になります。
- Click Element
- クリックされたすべての要素を計測
- Click Classes
- クリックされた要素のclass属性を計測
- Click ID
- クリックされた要素のid属性
- Click Target
- クリックされた要素のtarget属性を計測
- Click URL
- クリックされた要素のURLを計測
- Click Text
- クリックされた要素のテキストを計測
２．トリガーの設定
続いてトリガーを設定していきます。
左側のメニューから「トリガー」をクリックします。
トリガー一覧が表示されるので右上の「新規」をクリックします。
新しいトリガーにわかりやす名前を付けておきます。
中央の「トリガーの設定」をクリックします。
右からメニューが開くので「トリガータイプの選択」の中の「すべての要素」をクリックします。
トリガーの設定画面が開くので、今回はこのように設定します。
- このトリガーの発生場所
- 一部のクリック
- イベント発生時にこれらすべての条件が true の場合にこのトリガーを配信します
- 条件１つめ
- Page URL
- 含む
- 計測したいフォームが設置されているページのURL（が判別できる）
- 条件２つめ
- Click Element
- CSS セレクターに一致する
- [type="submmit"]
※条件２つめの[type="submit"]はご自身のサイトのフォームのソースを確認して、ソースに合ったものに変更してください。
これでこの条件でトリガーが発動する設定ができました。
続いてタグの設定です。
３．タグの設定
続いて左側メニューの「タグ」をクリックします。
すでにいくつかタグが設定されていると思います。右上の「新規」をクリックします。
新しいタグにわかりやすい名前を付けておきましょう。
中央の「タグの設定」をクリックします。
右側から「タグタイプの選択」画面が現れるので「Google アナリティクス」をクリックします。
「Google アナリティクス：GA4 イベント」を選択してください。
「測定ID」にGA4の測定IDを入力します。
測定IDをはGA4のウェブストリームにある測定IDです（G-で始まる）。
「イベント名」にわかりやすい名前を付けます。
ここは半角英数字記号（_）で命名してください。
イベントパラメータはこのように設定します。
- パラメータ
- イベント パラメータ： submit_button_click
- 値： {{Click Element}}
画面下の「トリガー」をクリックします。
先ほど設定したトリガーを選択して、右上の「保存」をクリックして完了です。
これでタグの設定が完了しました。
それではタグの作動をテストしてみましょう。
４．タグの作動をテストする
変数、トリガー、タグが設定できたらプレビューモードで動作をテストしてみましょう。
下のように設定した条件でタグがTags Firedになっているのを確認したら、この設定を公開します。
GA4のリアルタイムレポートでもタグの作動を確認しておきます。
これで「完了ページに遷移しない」フォームでの送信時のクリックが計測できるようになりました。
以上、問い合わせフォーム送信時に「完了ページに遷移しない」場合の計測方法─ボタンクリックを計測する方法の解説でした。
