Googleアナリティクス4を使って、WordPressのプラグイン「Contact Form 7」のCV計測設定をする方法を解説します。
Googleアナリティクス4とは、Googleアナリティクスの新しい計測方式です。従来型の計測はユニバーサルアナリティクスと呼ばれています。
新バージョンのアナリティクスは従来型と違って、ウェブサイトとアプリを両方計測できます。
新バージョンではタグの設定方法も画面UIもガラッと変わりました。長年慣れ親しんできたユニバーサルアナリティクスとの違いに戸惑っているのは、私だけではないはずです……。
2021年2月現在は、従来型のユニバーサルアナリティクスも新しいGoogleアナリティクス4も両方使うことができますが、新規で計測を始める場合はGoogleアナリティクス4が推奨されています。いずれ従来型のユニバーサルアナリティクスはサポートされなくなると思われるので、徐々に新方式に移行した方が良さそうです。
(すでにタグを設置済みの方はスキップしてください)
Googleアナリティクスの管理画面に入って、新しいプロパティを作ります。デフォルトでGoogleアナリティクス4の設定になっています。
画面の指示に従い、プロパティをセットアップします。「データストリーム」の作成までできれば、ひとまずセットアップは終わりです。
従来型と同じように、グローバルサイトタグを埋め込む必要があります。
1でプロパティを作成し、ストリームを作成し終えたら、作成したストリームをクリックします。
すると[タグ設定手順] が開くので、「グローバルサイトタグ」をクリックして開きます。挿入すべきコードが出てきます。
ここではGoogleタグマネージャーは使えません。
Contact Form7のCV設定はカスタムイベントを使うのですが、Googleタグマネージャーだと後述するカスタムイベントの送信ができないようです。(タグマネージャー管理画面から設定すればできそうですが、ここでは割愛します)
2で表示したタグをコピーして、サイトの全ページの<head></head>内に貼り付けます。
WordPressの場合は、header.phpの<head></head>の間に貼り付けます。
従来型は ga(‘create’, ‘UA-XXXXX-Y’, ‘auto’); という記述ですが、
新バージョンは gtag(‘config’, ‘G-XXXXXXXX’); という記述になっているのがお分かり頂けると思います。
WordPressのお問い合わせフォームプラグインとして人気の高いContact Form7。
お問い合わせフォームの送信をコンバージョンとして計測するためには、通常ならフォームの送信完了ページにコンバージョンタグを設置します。
が、Contact Form7には送信完了ページがありません。その代わり’wpcf7mailsent’というカスタム DOM イベントが用意されており、フォーム送信完了時にイベントを実行することができます。
カスタム DOM イベントを起動し、その中でGoogleアナリティクスに「フォーム送信」というカスタムイベントを送れば良いのです。
document.addEventListener( 'wpcf7mailsent', function( event ) {
//フォームの送信が無事に完了すると、ここに書いたものが実行される
}, false );下記は公式ドキュメントに記載されているものですが、これは従来型のユニバーサルアナリティクス向けの方法なので、これをアナリティクス4向け(正確にはgtag)に書き換えます。
document.addEventListener( 'wpcf7mailsent', function( event ) {
ga( 'send', 'event', 'Contact Form', 'submit' );
}, false );gtagのイベントの記述形式は以下です。
gtag('event', <action>, {
'event_category': <category>,
'event_label': <label>,
'value': <value>
});よって、イベントリスナーの中身をこんな風に書き換えます↓
以下のコードを丸ごとコピーして、グローバルサイトタグの下あたりに貼り付けます。
<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
gtag('event', 'submit', {
'eventCategory': 'Form',
'eventLabel': 'Contact Form'
});
}, false );
</script>フォームの設定は完了です。
ここで一度、お問い合わせフォームをテスト送信して、アナリティクス画面の「リアルタイム」でイベントが反映されているか確認しましょう。
反映されていれば次に進みます。
公式の解説に従って、アナリティクス上でコンバージョンを設定します。
管理画面で[イベント] > [コンバージョン]を開き、[新しいコンバージョン イベント] をクリックします。
コンバージョンに指定するイベント名は submit にして保存します。
これで、Contact Form7のフォーム送信がコンバージョンとして計測されます。
アナリティクスにイベントが正式に反映されるまでは丸一日くらいかかるので、前項までの設定を終えたら、一日ほど待ってからアナリティクス管理画面を開いて、正しく計測できているか確認してくださいね。
[イベント] > [コンバージョン]画面に、submit という名前のコンバージョンが確認できるはずです。
もし、右側の [コンバージョンとしてマークを付ける] がオンになっていなければ手動でオンにすればOKです。
