WordPress

Contact Form 7の送信数をアナリティクスで計測する方法【2019年最新】

「今まで計測できていたのに、ある日突然、Contact Form 7からの送信件数がアナリティクスに反映されなくなった・・・」

以前、GoogleアナリティクスやContact Form 7などの仕様変更によって、これまでの計測設定で計測できなくなったことがありました。

設定を変えていないにもかかわらず計測できなくなったので、また何らかの仕様変更だろうとは思いましたが、原因・対処方法の調査に非常に時間がかかりました。

アナリティクス側の公式情報でもContact Form 7についての言及や案内はなく、Contact Form 7側の公式情報でも、アナリティクスタグに新バージョンと旧バージョンがあることまで言及されていなかったため、なかなか解決策にたどり着けませんでした。

「これまではアナリティクスで計測できていたのに、いきなり計測ができなくなってから設定方法がわからない」
「初めてContact Form 7を導入し、コンバージョン計測設定をしたい」
という方向けに、現状最新の「Contact Form 7からの送信件数(コンバージョン数)を計測してGoogleアナリティクスに反映する方法」をご紹介させていただきます。

Googleタグマネージャーを利用しない場合の方法です。

前提条件:Googleアナリティクスのトラッキングコードは新gtag.jsバージョンを設置

Googleアナリティクスのトラッキングコードには、旧analytics.js、新gtag.jsの2種類あります。
2017年8月~β版として新gtag.jsが提供開始されました。

新gtag.jsの正式リリース時期の情報は見つかりませんでしたが、昨年夏頃以降は、アナリティクス管理画面からトラッキングコードをコピーする際、ほぼすべてのアカウントで新gtag.jsに切り替わってきていたと思います。
今のところ、旧analytics.js、新gtag.jsどちらも使用可能ですが、今回の計測設定のためには、新gtag.jsのトラッキングコードが設置されていることをご確認ください。

<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-115892529-1"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'UA-1234567xx-1');
</script>

上記のトラッキングID(太字のところ)はサンプルなので、固有のものに差し替えていただけたらと思います。

Googleアナリティクス「管理」→プロパティ「トラッキング情報」→「トラッキングコード」の「グローバル サイトタグ(gtag.js)」よりコピペしていただくと確実です。

WordPressテーマファイルのfunctions.phpに記述を追記する

次に、WordPressテーマファイルの中のfunctions.phpを編集します。

以下のコードをfunctions.phpの末尾に追記してください。
計測するフォームの数が1つか、2つ以上かによって変わります。

計測するコンタクトフォームが1つの場合

 add_action( 'wp_head', 'contactform7_hook' ); //「contactform7_hook」関数を内で実行します
 function contactform7_hook() {
 $output = "<script>
            document.addEventListener( 'wpcf7mailsent', function( event ) { //フォーム送信が完了した時
              if ( '12345' == event.detail.contactFormId ) { //contactform7のid
                gtag('event', location.href, {'event_category': 'フォーム送信','event_label': 'お問い合わせ'});
              }
            }, false );
            </script>";
 echo $output; //「output」定義された内容を出力します
 }

計測するコンタクトフォームが2つ以上の場合

 add_action( 'wp_head', 'contactform7_hook' ); //「contactform7_hook」関数を内で実行します
 function contactform7_hook() {
 $output = "<script>
            document.addEventListener( 'wpcf7mailsent', function( event ) { //フォーム送信が完了した時
              if ( '12345' == event.detail.contactFormId ) { //contactform7のid
                gtag('event', location.href, {'event_category': 'フォーム送信','event_label': 'お問い合わせ'});
              }
              else if ( '10123' == event.detail.contactFormId ) {
                gtag('event', location.href, {'event_category': 'フォーム送信','event_label': 'セミナー申し込み'});
              }
              else if ( '10456' == event.detail.contactFormId ) {
                gtag('event', location.href, {'event_category': 'フォーム送信','event_label': '個別相談'});
              }
            }, false );
            </script>";
 echo $output; //「output」定義された内容を出力します
 }

上記のContact Form 7の「ID」と「コンバージョン名」(太字のところ)を適宜ご編集ください。

Contact Form 7の「ID」は、WordPress管理画面の左メニュー「お問い合わせ」→「コンタクトフォーム」の「ショートコード」の中に記載があります。

IDをそれぞれfunctions.php内の上記のコードのところに転記し、それぞれ「お問い合わせ」「セミナー申し込み」など、重複せず判別しやすいコンバージョン名をつけておきます。

この「コンバージョン名」は、次のGoogleアナリティクスの目標設定のところで必要になります。

Googleアナリティクスの「目標」設定を編集する

それから、Googleアナリティクスの管理画面から、「目標」設定を編集します。

ここで、お問い合わせ送信、セミナーお申し込み、メルマガ登録など、サイトの目標(コンバージョン)となる項目の件数をアナリティクスに反映できるよう設定します。

画面左下の歯車アイコン「管理」→ビュー「目標」をクリックします。

「新しい目標」をクリックします。

今回は「目標設定」は「カスタム」を選択し、「続行」をクリックします。

「目標の説明」の「名前」は任意の名前をつけます。先ほどfunctions.phpで設定した「コンバージョン名」と統一する方が管理しやすいです。

「タイプ」は「イベント」を選択し、「続行」をクリックします。

「目標の詳細」では、

「カテゴリ」に「フォーム送信」、「ラベル」には先ほどfunctions.phpで設定した「コンバージョン名」を記入し、「保存」をクリックします。

以上で、設定は完了です。

きちんと計測されるか、テスト送信をして確認しましょう。

テスト送信後、Googleアナリティクスの左メニュー「リアルタイム」→「コンバージョン」にコンバージョン名と件数が反映されていれば問題ありません。

まとめ

この方法でコンバージョンが計測されない場合は、Contact Form 7のAjaxが正常に動いているかどうか、などご確認ください。
設定方法ではなく、WordPressテーマなどプログラム部分に原因がある可能性があります。

提供されているツールやプラグインなどは、よくバージョンアップや仕様変更によって、ある日突然勝手が変わったり不具合が生じることがよくあります。

ページスピードにも悪影響なので、極力むやみにプラグインをインストールしないようにしていますが、どうしても使用する方が便利なプラグインもあります。

仕様変更などで不具合が起きる度に、原因や新たな対応方法を調査するのは非常に時間も労力もかかり大変ですが、必要な部分についてはやむを得ません。