こんにちは、Loxyです。
ユニバーサルアナリティクスの廃止が正式にアナウンスされ、まだ少し先の話ですが対応に追われている方々も多いかと思います。
私はWordpressでサイト構築をすることが公私ともに多々あるのですが、お問い合わせはContact Form 7 (以下CF7）を使う事が良くあります。
皆さんよく使われていると思うCF7ですが、デフォルトだと確認ページやサンクスページへ遷移がないので、サンクスページのpage_viewを計測するにはひと手間必要です。
今回はCF4でサンクスページなしで送信ボタンをクリックしたイベント数を計測する方法を書いていきたいと思います。
実はネットにいくつか情報があったのですが、ちょっとわかりにくかったので自分用のメモです。
公式サイトに記載はあるが、、、
まず簡単にパッと思いつく方法はサンクスページを作って、送信後にリダイレクトしサンクスページのpage_viewを計測する感じですかね？
ただ、サンクスページ作らないといけなかったり、リダイレクト実装（またはプラグインで対応）など手間がかかります。
実は、CF7の公式サイトにサンクスページなしでフォーム送信のトラッキング方法の記載はあります（知らなかった…）。
ですが現行のユニバーサルアナリティクスの方法です。GA4では計測されません。
GA4版の設定手順
それではGA4版でフォーム送信をトラッキングする方法をみていきます。
サイト側の設定
まずはHTMLソース内に下記のスクリプトを挿入します。
<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
gtag('event', 'submit', {
'eventCategory': 'Form',
'eventLabel': 'Contact Form'
});
}, false );
</script>今回テストした環境はWordpressであったので、footer.phpのbody閉じタグ前あたりに挿入しました。
サイト側の設定はこれでOKです。
アナリティクス側の設定
続いてアナリティクス側の設定を入れていきます。
※こういった設定系ではよくあることですが、即反映されません。設定後1日くらい待つ必要がありますのでご注意を
まずは、アナリティクスで「設定 ＞ イベント」をクリック
続いて「イベントを作成」をクリック
イベント作成ページで下記の設定（カスタムイベント名は任意です）
| カスタムイベント名 | submit（任意OK） |
| パラメータ | event_name |
| 演算子 | 等しい |
| 値 | submit |
| ソースイベントからパラメータをコピー | チェックON（デフォルトのままでOK） |
な感じですかね。入力できたら右上の「作成」ボタンをクリック！
こんな感じにイベントが作成されました。
この時点では既存のイベントの一覧に表示されません。一日くらい待ちましょう。
1日経過後
１日後に確認してみます。先ほど追加した「submit」が表示されていることがわかります。
これで設定はOKです。これでCF7のフォーム送信されると計測ができるようになりました。
計測の確認はアナリティクスGA4の「エンゲージメント＞イベント」などから確認できます。
まとめ
今回はCF7のフォーム送信のGA4版トラッキングについて紹介しました。
UAの廃止2023年7月は少し先ですが、早めの対応をしておいた方が良いかもしれませんね。
少しでもお役に立てれば幸いです。
それでは！
