最も必要とされている時に、信頼できるWordPressチュートリアルを。
WordPress入門ガイド
WPBカップ
3000万以上
当社のプラグインを使用しているウェブサイト
20+
WordPress経験年数
3000+
専門家によるWordPressチュートリアル

WordPressで会話型フォームを作成する方法

長くて威圧的なフォームは、訪問者が開始する前に諦めてしまう可能性があります。訪問者に長いフィールドリストに記入してもらう代わりに、フォームを一度に1つの簡単な質問に分割します。

それが会話型フォームの背後にある考え方です。従来のフォームを、よりインタラクティブでステップバイステップの体験に変換し、完了するのが簡単で自然に感じられます。

このガイドでは、WordPressサイトで会話型フォームを作成する方法を説明します。

WordPressで会話型フォームを作成する方法

会話型フォームとは何ですか?&それを構築する方法は?

会話型フォームは、すべてのフィールドを1ページにまとめるのではなく、訪問者に一度に1つの質問を表示します。また、独自の専用URLを持っているため、別のページに埋め込むことなくフォームを直接共有できます。

会話型フォームを構築するために、いくつかの理由から、Typeformのようなホスト型フォームソリューションよりもWordPressフォームプラグインを使用することをお勧めします。

  • 従量課金制ではありません。フォームが受け取る応答数に基づいて請求されるのではなく、固定価格を支払います。
  • データは独自のサーバーに残ります。エントリは、サードパーティのフォームソリューションではなく、WordPressホスティング上に存在します。
  • 無制限のフォーム。アカウント制限を恐れることなく、好きなだけフォームを作成できます。

WordPressで会話型フォームを作成する

WordPressで会話型フォームを作成する最も簡単な方法は、WPFormsを使用することです。WPBeginnerでは、簡単な連絡フォーム、リード獲得フォームなど、あらゆる種類のフォームを作成するためにこれを使用しています。

実際に完成した会話型フォームは次のようになります。

WordPressでのライブ会話型フォーム

プラグインの詳細については、WPFormsレビューをご覧ください。

まず、WPFormsプラグインをインストールしてアクティブ化します。会話型フォームアドオンにアクセスするには、「Pro」プランが必要です。

詳細な手順については、WordPressプラグインのインストール方法に関するステップバイステップガイドを参照してください。

有効化後、ライセンスキーを確認するためにWPForms » 設定ページにアクセスする必要があります。この情報はWPFormsウェブサイトのアカウントエリアで見つけることができます。

WPFormsのライセンスキーのアクティブ化
会話型フォームアドオンをインストールする

次に、WPForms » Addonsに移動し、Conversational Formsアドオンを見つけます。

アドオンページで、「会話型フォーム」アドオンを探し、「アドオンのインストール」ボタンをクリックしてからアクティブ化します。

WPFormsの会話型フォームアドオンのインストール

これで、アドオンのステータスが「アクティブ化済み」と表示されます。

会話型フォームを作成する

このチュートリアルでは、例としてアンケートフォームを作成します。アンケートは、訪問者が回答する必要のあるいくつかの質問が含まれることが多いため、会話形式に適しています。

WordPress管理画面から WPForms » 新規追加フォーム に移動します。次に、フォームに名前を付け、利用可能なオプションからテンプレートを選択できます。

WPFormsを使用した新しいユーザー調査フォームの追加

または、アンケートフォームテンプレートをスキップして、必要なフォームを平易な言葉で説明すると、WPForms AI がフィールドを作成します。

WPForms AI を開始するには、「AIで生成」テンプレートをクリックします。「WPForms AI」アドオンがまだ有効になっていない場合は、アドオンを有効にするように求められます。

これにより、WPForms AI フォーム生成ページに移動します。このページでは、フォームを平易な英語で説明すると、AI が自動的にフォームを作成します。

WPForms AI フォームの実際の動作

フォームが存在したら、ビルダー内でさらに改良を続けることができます。フィールドの追加、質問の並べ替え、または言い換えを依頼できます。どちらの方法を選択しても、WPForms のドラッグアンドドロップインターフェイスを使用して手動でフォームを微調整できます。左側のパネルからフィールドを右側のフォームエディターにドラッグするだけです。

サンプルWPFormsアンケートフォームは次のようになります。

WPFormsエディターでの調査フォーム

詳細については、WordPressでアンケートを作成する方法に関するステップバイステップガイドを参照してください。

会話型フォームモードをオンにする

アンケートの質問を追加したら、左側のパネルの 設定 » 会話形式フォーム タブに移動し、「会話形式フォームモードを有効にする」をオンにします。

WPFormsでの会話型フォームモードの有効化

会話形式モードを有効にすると、フォームのタイトル、ウェルカムメッセージ、パーマリンクなど、フォームをカスタマイズするためのいくつかの設定が表示されます。

  • 会話形式フォームのタイトル。「アンケートにご協力ください!」のような、短くてわかりやすいタイトルをフォームに付けます。
  • メッセージ。訪問者にフォームの完了を促す短いメッセージを追加します。
  • パーマリンク。これは、スタンドアロンフォームページの固有の URL です。WPForms はタイトルに基づいて自動的に 1 つ作成しますが、必要に応じて編集できます。
会話型フォームの詳細の追加とカスタマイズ

青い「会話形式フォームをプレビュー」ボタンをクリックすると、いつでも変更をプレビューできます。

会話型フォームのデザインを変更する

タイトル、メッセージ、パーマリンクフィールドの下に、フォームのランディングページの表示方法をカスタマイズするためのオプションがさらに 4 つあります。

  • ヘッダーロゴ。「画像をアップロード」をクリックしてロゴを追加します。
  • WPForms のブランディングを非表示にする。ランディングページに「WPForms 提供」メッセージを表示したくない場合は、このボックスをチェックします。
  • カラー スキーム。「送信」ボタンとページ背景の色を選択します。定義済みのカラー スキームから選択するか、カラー ピッカーを使用して独自のカラーを選択できます。
  • プログレス バー。「パーセンテージ」と「割合」のスタイルのいずれかを選択します。パーセンテージはユーザーの進捗状況をパーセンテージで表示し、割合は完了した質問の数を合計数で表示します(例:「8 件中 3 件」)。
会話型フォームの外観の調整
会話形式フォームの公開

設定を保存したら、会話形式フォームはサイトの既存のページ内ではなく、独自のページに存在することを忘れないでください。独自のパーマリンクがあるため、リンクを共有するか、訪問者が見つけられる場所に配置する必要があります。

リンクをナビゲーションメニュー、関連する投稿やページに追加したり、メールニュースレターで直接共有したりできます。

公開された会話型フォームのページは、次のようになります。

WordPressでのライブ会話型フォーム

動画チュートリアル:WordPressで会話型フォームを作成する方法

動画での説明をご覧になりたい場合は、こちらをご覧ください。

WPBeginnerを購読する

よくある質問:会話型フォームについて

WordPressで会話型フォームを作成することに関する、よくある質問をいくつかご紹介します。

どのような種類のフォームが会話型フォームとして適していますか?

会話型フォームは、アンケート、イベント登録、ユーザー登録、リード獲得フォーム、フィードバックフォーム、その他複数の質問を含むフォームに役立ちます。

フォームの通知メールが受信トレイに届くようにするにはどうすればよいですか?

デフォルトでは、WPFormsはウェブホストの標準PHP mail()関数を使用して通知メールを送信しますが、これによりメールがまったく送信されない可能性があります。認証済みSMTPプロバイダーを介して通知をルーティングするWP Mail SMTPをお勧めします。詳細については、WordPressがメールを送信しない問題を修正する方法に関するガイドをご覧ください。

会話型フォームは従来のフォームよりも優れていますか?

フォームの種類によります。会話型フォームは、複数の質問がある長いフォームに特に効果的ですが、従来のフォームは、数個のフィールドしか必要としない短いフォームに適している場合があります。

この記事が、WordPressで会話型フォームを簡単に作成する方法を学ぶのに役立ったことを願っています。また、WordPressの最高のコンタクトフォームプラグインWordPressフォームのスタイル設定方法も確認することをお勧めします。

この記事が気に入った場合は、WordPressのビデオチュートリアルのために、YouTubeチャンネルを購読してください。また、TwitterFacebookでも私たちを見つけることができます。

開示: 当社のコンテンツは読者によってサポートされています。これは、一部のリンクをクリックすると、手数料が発生する可能性があることを意味します。WPBeginnerがどのように資金調達されているか、なぜそれが重要なのか、そしてどのように私たちをサポートできるかを確認してください。こちらが当社の編集プロセスです。

究極のWordPressツールキット

無料のツールキットにアクセスしましょう - すべてのプロフェッショナルが持つべきWordPress関連の製品とリソースのコレクションです!

読者とのインタラクション

10件のコメント返信する

  1. 非営利団体を設立したばかりで、これを行う無料のプラグインはありませんよね?
    また、参考までに、別の記事ではコメントオプションが見当たらなかったのですが、CSS Heroプラグインについて言及されていました。WPでそのプラグインを見つけられませんでした。私が何か間違っているのかどうか分かりません。

    • 条件ロジックを意味するのであれば、WPFormsで設定できますが、プラグインが提供するものに関する質問については、プラグインのサポートに問い合わせる必要があります:)

      管理者

    • フィードバックありがとうございます。これはWPFormsが将来的に機能として追加を検討できるものです。

      管理者

返信する

コメントいただきありがとうございます。すべてのコメントは、コメントポリシーに従ってモデレーションされ、メールアドレスは公開されません。名前フィールドにキーワードを使用しないでください。個人的で意味のある会話をしましょう。