定番プラグインContact Form7で作った問い合わせフォームからメッセージが送信されたときに、そのイベントをGoogle Analytics側で取得して、目標値として計測したかったのですが、色々思うようにいかずハマってしまったので、その状況と解決に至った道をまとめたいと思います。

contactform7-googleanalytics

 

今回やりたかったのは、前述のとおり

Contact Form7の問い合わせが送信されたときにGoogle Analyticsでイベントとして取得したかった

ということで、そのあたりの具体的な方法は以下の二つのサイトが参考になります。

【Googleアナリティクス】目標設定とイベントトラッキングを設定しよう!

簡単で完璧!WordPressの問い合わせフォームのプラグイン『Contact Form7』にGoogle Analyticsのコンバージョンタグを設定する方法

 

上のサイトの手順通りにやっていけば普通ならそれでイベントがトラックできるはずです。が、私の場合はトラッキングできなかった。。その時の状況としては

  • Thank youページには飛ばない設定で送信ボタンをクリックすると、送信完了メッセージが表示されない
  • Contact Form7で利用できるアクションフック(ユニバーサルアナリティクス用)を設定
  • Google Analyticsではユニバーサルアナリティクスになっていることを確認済み

という感じでした。

順に詳細を記述していきます。

sponsored link

 

Google Analyticsでイベントが取れなかったときの状況

Contact Form7では送信ボタンをクリック後、thank you ページ(送信完了ページ)に遷移するのではなく、フォームのあるページ内に「送信完了しました」というメッセージを表示させる方法を推奨しています。

Thank youページに遷移させるなら、そのページへの遷移をGoogle Analytics側でイベント計測すればいいので問題はないのですが、今回はわざわざThank youページに飛ばすのではなく、送信完了メッセージを同一ページ内に表示させたいという希望がありました。

Contact Form7では、以下のようなon_sent_okアクションフックを使うことで送信イベントを取れるようになります。

 

が、このアクションフックを設定すると、問い合わせの送信完了メッセージが表示されなくなってしまいました。

問い合わせ自体は送信されているのですが、「送信完了しました」というメッセージが表示されないと、送った側は「アレレ、送信されたのかな??」と不安になりますよね。

 

で、この状況を調べてみたところ、以下のサイトに「Javascriptのコンフリクトの可能性がある」という情報がありました。

Contact Form7でコンバージョンを計測する方法

on_sent_okフックを使うとメッセージが表示されないのは他のプラグインで使われているjavascriptとのコンフリクトが起きている可能性があるため、これを解決するには、使用中のプラグインを全部止めてどれが原因なのか調べる必要があると。。

「ええー、面倒くさいよ・・・」と思いつつ、止められるプラグインは全部止めてみたものの、変化なし。

 

必須プラグインとコンフリクトしているとしたらどうしようもないな・・・と思い、半ばあきらめモードになりました。

が、ふと思い立って、ブラウザのデベロッパーツール(Windowsの場合 Ctrl + Shift + i または F12キー)を開いてみたところ、こんなエラーが発生していることが判明。

Reference Error: ga is not found 

 

gaという変数がありませんよ、というエラーですよね。これ。調べてみると、Google Analyticsでユニバーサルアナリティクスに設定されているかいないかで、gaだったり_gaqだったりするらしいです。

ユニバーサルアナリティクスに変更したときは、Contact Form 7のコンバージョン設定も変更するべし! http://hamatte-wataru.com/analytics_contact_form_7/

しかし、私の場合はGoogle Analyticsはユニバーサルアナリティクスになっているし、これはちょっと違う話だなと。

 

解決に至った道。原因はYoast Google Analyticsだった!

問題が起こると最近はデベロッパーツールで中身を覗くことが多いのですが、生のソースコードを一覧するっていうのも時には大切なんだなということを学びました。

 

コンタクトフォームを設置しているページのソースコードを見てみると… なんと、gaとなっているはずのところが、__gaTrackerになっている!!

 

なんでだろう!??と思い、よくよく見てみると、このトラッキングコードはプラグインGoogle Analytics by Yoastが吐き出しているものだと分かる。

 

そこでこの件について調べてみたところありました!こんな情報が。

Yoast Google Analytics Reassign ‘__gaTracker’ Tracker to ‘ga’ Variable

 

つまり、このプラグインはga変数を__gaTrackerにリアサインしているということらしい。そんなぁ。。。なんでわざわざ。。

解決方法は上のサイトにもありましたが、

 

このコードをYoast Google AnalyticsプラグインのAdvancedタブにあるカスタムコードに追加すればOK。

Yoast Google Analyticsプラグインを使用している方は要注意ですね。

 

これでContactForm7からの送信イベントがGoogle Analytics側でトラックできるようになり、送信完了メッセージも表示されるようになりました!