コンバージョンの高い、ごちゃごちゃしないフォームを作りたいなら、マルチページフォームがおすすめです。複数のページに分割することで、フォーム疲れを防ぎ、ユーザーのエンゲージメントを高めることができます。この記事では、WordPressでマルチステップフォームを作成し、より多くのコンバージョンを獲得する方法をご紹介します。
その前に、なぜWordPressでマルチステップ・フォームを使うのか？
なぜWordPressにマルチステップフォームを追加するのか？
前述したように、マルチステップのフォームは複数のページに分割されます。フォームにステップを増やすことは直感に反するように思えるかもしれませんが、実はフォームのコンバージョン率を上げることができるのです。
マルチステップフォームは、ユーザーが一度に多くの選択をしなければならないという摩擦を減らします。シンプルなオプションは、フォームの各ステップに負担をかけず、プログレスバーはユーザーがフォームを続けて完了することを促します。
完了率を高めるためにフォームを絞り込んでいるので、フォームの放棄を経験する可能性は低くなります。また、条件付きロジックを使用することで、ユーザーの回答に基づいて異なるページを提供することができ、必要な情報のみを簡単に収集することができます。
では、なぜマルチステップ・フォームを使うことがユーザーエクスペリエンスに優れているのかを理解していただいたところで、WordPressでのフォーム作成に移りましょう。
WordPressでマルチステップフォームを作成する方法
このチュートリアルでは、WPFormsを使ってWordPressでマルチパートのフォームを作成します。WPFormsはドラッグ＆ドロップでWordPressのフォームを作成できる最高のプラグインです。WPFormsはドラッグ＆ドロップでWordPressのフォームを作成できる最高のプラグインです。
WPFormsには無料版と有料版がありますが、今日はWordPressで複数ページのフォームを作成するためにWPFormsのPro版を使用します。
詳しくはWPFormsのレビューをご覧ください。
それでは最初のステップ、新しいフォームの作成から始めましょう。
ステップ1: WordPressに新しいフォームを作成する
まず最初に行うことは、WPFormsプラグインをインストールして有効化することです。もし方法がわからない場合は、初心者のためのWordPressプラグインインストールのステップバイステップガイドに従ってください。
WPFormsではどんなタイプのフォームでも複数のパーツに分割することができます。
WPForms " Add Newで新しいフォームを作成し、利用可能なテンプレートを表示します。
その画面でフォームに名前をつけ、シンプルコンタクトフォームのテンプレートを選びます。
WPFormsはドラッグ＆ドロップフォームビルダーでテンプレートを開き、編集できるようにします。
シンプルなお問い合わせフォームには、以下のフィールドがすでに追加されています：
- 名称
- 電子メール
- コメントまたはメッセージ
また、左側の列から右側の列にドラッグすることで、フォームフィールドを移動したり、フィールドを追加したりすることもできます。任意のフォームフィールドをクリックして内容を編集し、ドラッグして位置を変えてください。
WordPressサイトにお問い合わせフォーム以外のフォームを追加したい場合は、WPFormsで以下のフォームタイプも作成できます：
これらのフォームタイプのほとんどは、標準的なコンタクトフォームよりも長いため、複数のステップに分けることでコンバージョンを向上させることができます。
さて、フォームを分割する方法を学びましょう。
ステップ 2: フォームを複数のパーツに分割する
フォームをカスタマイズして必要なフィールドを追加したら、Page Breakフィールドを追加してフォームを異なるページに分割します。
Fancy Fields "見出しの下にある "Page Break"フォームフィールドを右側のパネルにドラッグしてください。
次に、フォームの分割したい場所にフィールドをドロップします。
フォームを別のページに分割したいすべてのセクションでこれを繰り返します。そこから、フォームを完成させるために必要なフィールドを追加して、フォームのカスタマイズを続けます。
WPFormsでは好きなだけフォームを追加することができますが、あまりに多くの情報でユーザーを圧倒しないようにすることが重要です。そうすることで、ユーザーがフォームを放棄してしまう可能性があります。
ステップ 3: フォームのプログレスバーをカスタマイズする
フォームの流れを良くするために、プログレスバーを含めることができます。プログレスバーは、フォームのさまざまなセクションについて人々に伝え、あとどれくらいで完了するのかを視覚的に示す素晴らしいインジケータです。
WPFormsには、マルチステップフォーム用に以下の3種類のプログレスインジケータバーが用意されています：
- コネクター- フォームの各ステップのコネクティングバーとページタイトル。
- サークル- 各フォームのステップに番号が振られたサークルとページタイトル。
- プログレスバー- ユーザーがフォームのステップを完了する際の進捗状況を示すインジケータ。
複数ページフォームの最初のページのプログレスバーとページタイトルを変更するには、最初のページ区切りフィールドをクリックします。
すると新しいパネルが表示され、フォームの進捗タイプを選択することができます。このエリアでは、進捗インジケータの色を変更することもできます。
丸やコネクタのオプションを選択すると、ページタイトルも変更できます。そうすることで、ユーザーがフォームのどの部分にいるのかを知ることができ、迷うことがなくなります。しかし、そうしたくない場合は、標準のプログレスバーがユーザーに表示され、フォームへの入力をガイドします。
次に、ユーザーをフォームの次のページに移動させる「次のページ」ボタンとテキストを変更することができます。
これを行うには、フォーム作成時に追加した改ページセクションをクリックします。
さらに、トグルをオンにして「前のページ」ボタンを追加することもできます。そうすることで、ユーザーが情報を追加し忘れた場合に戻ることができます。
プログレスバーのカスタマイズが完了したら、「保存」をクリックして次のステップに進みます。
ステップ 4: フォームの設定を編集する
では、フォーム設定の編集に移りましょう。これを行うには、設定 " 一般に進みます。
このセクションでは、以下のオプションを設定できます：
- フォーム名- フォームに新しい名前を付けます。
- フォームの説明- 参照のためにフォームに説明を追加します。
- 送信ボタンテキスト- 送信ボタンのテキストを変更します。
- スパム設定- スパマーによる不要な送信を防ぐため、スパム対策ハニーポットオプションを有効にします。
- GDPR機能-GDPRに準拠するため、IPアドレスやその他の機密データなど、フォームに入力された情報の保存を無効にします。
設定が完了したら、「保存」をクリックします。
ステップ 5: フォーム通知を設定する
WPFormsの通知設定は、WordPressサイトでフォームが送信されたときにメールを送信します。
設定 " 通知 をクリックすると、通知設定が表示されます。
しかし、フォーム通知を無効にしなければ、あなたのサイトでフォームが送信されるたびにメールが届きます。
一方、スマートタグを使えば、フォームに入力した人にメールを送ることができます。スマートタグは、フォームが正しく送信され、あなたがそれを受け取ったことを知らせる優れた方法です。
複数のステップがある長いフォームでは、入力に時間がかかる可能性があるため、この機能を使うとさらによい。さらに、入力がうまくいったかどうか、ユーザーを迷わせずに済みます。より詳しいヘルプは、フォーム通知の設定に関するドキュメントをご覧ください。
通知の設定が終わったら、フォームの確認メッセージの設定に移ります。
ステップ 6: フォームの確認メッセージを定義する
フォーム確認メッセージは、ユーザーがあなたのサイトでフォームを送信したときに表示される簡単なメッセージです。フォームが処理され、次にどのようなステップを踏むべきかを伝える優れた方法です。
WPFormsには3種類の確認メッセージがあります：
- メッセージ- フォームが送信されたことを知らせるシンプルなメッセージ。
- ページを表示する- フォームを送信した後、サンキューページなど別のページにユーザーを送ります。
- URLへ移動（リダイレクト）- フォーム送信後、サイト訪問者を別のウェブサイトに移動させます。
確認メッセージを設定するには、設定 " 確認をクリックします。
次に、フォーム入力後に訪問者に表示するメッセージの種類を選択します。このチュートリアルでは「メッセージ」を選択します。
メッセージ・テキストをあなたのニーズに合わせてカスタマイズし、満足したら「保存」をクリックします。
これでWordPressにフォームを追加する準備ができました。
ステップ 7: WordPressにフォームを追加する
マルチステップフォームを作成したら、WordPressサイトに追加しましょう。WPFormsを使用すると、ウェブサイトの多くの領域にフォームを追加することができます。これは、あなたのサイトのページや投稿、サイドバー、および他のウィジェット対応の領域が含まれています。
WordPressページにマルチステップフォームを追加する方法を見てみましょう。
まず、WordPressの管理画面にアクセスし、ページ " 新規追加をクリックします。
次に、WordPressエディターのプラスアイコンをクリックして、新しいコンテンツブロックを追加します。検索フィールドにWPFormsと入力すると簡単に見つかります。
WPFormsブロックをクリックしてページに追加します。
WPFormsがブロック内に表示されたら、ドロップダウン矢印をクリックしてリストからマルチステップフォームを選択し、ページに挿入します。
そして公開をクリックして WordPress でページを公開します。これであなたのウェブサイトにマルチステップフォームが表示されます。
以上です！WordPress でマルチステップフォームを作成する方法を学んだので、すぐにユーザーエンゲージメントとフォームコンバージョン率を向上させることができます。
この記事が気に入ったら、あなたのサイトで使えるWordPressプラグインのショーケースもご覧ください。
その他のフォームのチュートリアルについては、以下の記事を参照のこと：
- ファイルアップロード機能付きWordPressフォームの作り方
- Typeformスタイルのフォームの作り方
- WordPressでお問い合わせフォームを作成する方法
- WordPressでオンライン注文フォームを作成する方法
- WordPressイベント登録フォームの作り方
もしよろしければ、フェイスブックや ツイッターで、より役立つヒントやチュートリアルをご覧ください。
