MW WP FormをGoogleアナリティクスで計測できるようにする方法【設定全公開】

フォーム作成の定番プラグイン「MW WP Form」。これ一つで確認画面まで作れるので、とても便利ですね。私も重宝しています。

ただ、普通に設定すると確認画面もサンクスページも、全て同じURLになってしまいます。

これだとGoogleアナリティクスで正確に計測できません。

そこで今回はMW WP Formで作る問合せ画面のURLを「入力画面」「確認画面」「サンクスページ」で分けて、サンクスページに至った場合だけGoogleアナリティクスで計測する方法を解説します。

このブログで使っている設定も全てお見せしますので、ぜひ参考にして下さい。

MW WP Form をインストールする

「もうインストールしている」という方は、次のステップへ進んで下さい。

WordPressの管理画面にある「プラグイン」から「新規追加」を選びます。

画面右上に表示された「キーワード」欄に「MW」と入力すると、自動的に検索が始まります。

上の方に「 MW WP Form 」というのが表示されるので「今すぐインストール」をクリックしましょう(↓)。

「今すぐインストール」のボタンが「有効化」に変わったら、それをクリックして有効化します(↓)。
これでインストールは完了です。

左側に「 MW WP Form 」というメニューが表示されるようになりました。

その中の「新規追加」をクリックします。下のような設定画面が表示されます。ここでお問合せフォームの一切を設定します。

MW WP Form を設定する

この後のステップを確認

この後は、次のステップで作業を進めます。

  1. MW WP Form の設定(少し複雑)
  2. 固定ページで 「入力画面」「確認画面」「サンクスページ」 を作成して、その中にMW WP Form のショートコードを埋め込む(下図)
  3. Googleアナリティクスで、サンクスページを目標に設定する

というわけで、まずはMW WP Formの設定から始めましょう。

MW WP Form 設定の完成形

まず、完成形を確認しておきます。

右クリックしてダウンロードすると拡大できるので、それを見ながら入力してもらってもいいでしょう。

MW WP Form の設定 ①各項目の入力

フォームで社名を入力してもらいたい場合、次のように設定します。

「御社名」と入力し、その次の行にカーソルを移動してから、プルダウンメニューから「テキスト」を選び「フォームタグを追加」ボタンをクリックします(下図1)。

するとポップアップウィンドウが出るので、nameの箇所に「coname」と入力します(※半角英数字であればconameでなくてもOK)。

最後に「Insert」ボタンを押します。

すると、下のようにフォームタグが入力されます。

同じようにして、他の項目も入れていきましょう。

「テキスト」と「テキストエリア」の違いですが、1行だけ入れるもの(名前、会社名など)が「テキスト」。
「お問合せ内容」のように文章を入れてもらうのが「テキストエリア」です。

私の場合は最終的に下のようになりました。

MW WP Form の設定 ②完了画面メッセージ

フォームを送信した後に画面に表示する文章を設定します。

ここは普通にテキストを書くだけで構いませんが、相手の名前やメールアドレスを表示する場合は、先に設定したフォームタグ内の「name」部分と同じにする必要があります。

例えば、名前の部分で「name=”name”」としていた場合は

{name}さん、こんにちは。

と書くと相手の名前が田中さんの場合「田中さん、こんにちは。」と表示することができます。

私の場合は、入力されたメールアドレスを以下のように表示しています。

MW WP Form の設定 ③URL設定

ここは、前に書いた 「入力画面」「確認画面」「サンクスページ」のアドレスを設定する箇所です。

何も入力しないと、確認画面やサンクスページも入力画面と同じURLになってしまいます。

このサイトの場合だと、3つともhttps://yorokobeam.com/contact/になるわけです。

それだと入力画面まで来て離脱したのか、問い合わせを実行したのかがGoogleアナリティクスで判別できません。

そのため3つを異なるページとして用意する必要があるわけです。

私の場合は下のようにしました。

ここに書くだけではダメで、別途/confirm/や/thanks/のページ(固定ページが良いと思います)を用意する必要があります(後述)。

なお「エラー画面URL」欄に「/」が入っていますが、空欄だとエラーになるとの話もあり、入れたものです。

MW WP Form の設定 ④自動返信メール設定

画面の右側へ移ります。

ここの上にある「自動返信メール設定」は、フォームに入力した人に送るメールを設定する箇所です。

下の設定例を見てもらえれば、だいたいの意味は分かってもらえると思います。

注意点は本文内の置き換え文字は{name}様のように、{ }で囲うのに対し、下の方にある「自動返信メール」欄は{ }は使わない点です。

MW WP Form の設定 ⑤管理者宛メール設定

フォームが利用された時に管理者(あなたのことです)宛にメール送信する機能です。

MW WP Form の設定 ⑥設定

ここは、それほど重要ではありません。私は「問い合わせデータをデータベースに保存」にのみチェックしています。

ここまで入力できたら、画面右上の「公開」欄にある「公開」または「更新」ボタンを押して保存しておきます。

MW WP Form の設定 ⑦フォーム識別子をコピーする

最後にフォーム識別子をコピーします(画面右上にあります)。

この後使うのですが、一旦メモ帳等に貼り付けておくといいでしょう。

これを各ページ( 「入力画面」「確認画面」「サンクス ページ」)に貼り付けることで、フォームが表示されるようになります。

入力画面・確認画面・サンクス ページを作ってショートコードを埋め込む

それでは入力画面から作っていきましょう。

なおページ名「contact」とか「confirm」とかは、私が決めたものなので、もちろん違っても問題ありません。

入力画面を作る

メニュー「固定ページ」→「新規追加」をクリックします。

新規ページが表示されるので、タイトル、アイキャッチ画像、ショートコードを入れていきましょう。

アイキャッチ画像は入れなくても構いませんが、入力を促す画像があった方がいいと思います。

ショートコードは画面内の+(プラス)ボタンを押すと表示されます。表示されない場合は「すべて表示」をクリックして、その中から探して下さい。

この中に、先ほどコピーしたフォーム識別子を入れます。

画面右の「URLスラッグ」欄に「contact」と入力しましょう(※一度、保存しないとURLスラッグ欄が表示されないことがあります)。

最後に画面右上の「保存」または「更新」をクリックします。

確認画面を作る

続いて確認画面を作ります。

私はタイトルは入れず、見出しだけにしています。この辺りはお好みでどうぞ。

確認画面はシンプルな方がいいかと思い、画像は一切入れていません。

ショートコードは、入力画面と同じものを入れます。

URLスラッグは確認なので「confirm」にして保存しました。

サンクスページを作る

サンクスページもやり方は同じです。

文章はMW WP Form内の設定で入れてあるので、見た目はとてもシンプルです。

ここでは画面右側で「アイキャッチ画像」を入れてみました。

最後に保存します。

これで問い合わせ画面が全て完成です。

正しく動くか、一度試してみましょう。

Googleアナリティクスでサンクスページを目標に設定する

Googleアナリティクスの管理画面に行きます(画面左下の歯車のアイコンをクリックすると管理画面に移動します)。

管理画面の右端「ビュー」の3行目にある「目標」をクリックします(↓)。

「新しい目標」ボタンをクリックします(↓)。

「目標の説明」で名前とタイプを入力します。

名前は自分で分かる名前にしておきましょう。今回は「問合せ」にしました。

タイプは「到達ページ」にチェックを入れます。

到達ページというのは、特定のページが表示されたら「目標達成」と判断させたい時に選択します。

今回はサンクスページが表示されたら目標到達と認識させたいので、到達ページを選択しました。

「続行」をクリックします。

「目標の詳細」欄では、「到達ページ」の項目にページを指定します。

今回はhttps://yorokobeam.com/thanks/が表示されることを条件としたいので、「 /thanks/ 」と入力します。

httpsから始まる絶対パスを全て入れるわけではないので注意しましょう。

続いて、その下の「目標到達プロセス」を設定します。

これは必須ではないのですが、ユーザーがどこから離脱したのか教えてくれるので、設定することをお勧めします。

まず 「目標到達プロセス」 をオンにします。

その後、各ステップを入力します。下のサンプル図では確認画面(confirm)が抜けていますが、今回作った固定ページを全て設定した方がいいでしょう。

ステップ名前スクリーン/ページ必須
1フォーム/contact/はい
2確認/confirm/はい
3完了/thaks/はい

「保存」をクリックします。

元の画面に戻りました。目標が設定されているのが分かります。

以上で設定は全て完了です。お疲れ様でした。

MW WP FormをGoogleアナリティクスで計測する意味

フォームの利用があれば、問い合わせメールが送られてきます。それを記録していれば、いつ・誰から問い合わせが来たかは分かります。

ただ、それだけだと問い合わせをしたユーザーが、どこから来たのかといった情報は分かりません。また、問い合わせの途中で離脱した状況も、送信されたデータだけでは見えてきません。

ユーザーの動きをより詳細に把握するには、Googleアナリティクスでデータを取れるようにしておくことは必須です。

特に問い合わせというコンバージョンに結びついたユーザーの動きは、今後のサイト運営上も大切です。

ぜひ取得してサイト改善に活かすようにして下さい。

ヨロコビームでは、B2Bサイト解析・改善に関するご相談に乗っています。

ご不明な点がありましたら、お気軽にお問合せ下さい。