WordPressで会話形式のフォームを作成する方法をお探しですか?
まるで会話をしているかのようにユーザーがフォームに記入できる方法を提供することは、フォームの放棄を減らし、フォームの完了率を高める素晴らしい方法です。
この記事では、2つの異なる方法を使ってWordPressでインタラクティブなフォームを作成する方法を紹介します。
会話型オンラインフォームの利点とは?
実際の会話を模倣したフォームを作成することには、多くの利点がある:
- 記入がより簡単で速くなり、フォームへの記入率が向上
- ユーザーにとってパーソナルで魅力的
- キーボードだけで入力できるため、フォームへのアクセシビリティが高まる
- インタラクティブな性質がユーザー体験を向上させる
この記事で
WordPressで会話型フォームを作成する方法
異なるWPFormsアドオンを使用して会話型フォームを作成する2つの方法があります。
- Conversational Forms:このアドオンを使うと、TypeformスタイルのフォームをWordPressで再現できます。フォームが別ウィンドウで開くので邪魔になりません。Conversational Forms の主な欠点は既存のページに埋め込めないことです。
- リードフォームこのアドオンでは、任意の投稿やページに埋め込むことができる会話形式のフォームを作成することができます。リードフォームアドオンは、より多くのリードを生成したい場合や、通常のフォームに代わる魅力的なマルチステップフォームを公開したい場合に最適です。
Lead Formsアドオンで作成したフォームの例です:
このチュートリアルでは、会話型フォームを使うことに焦点を当てます。
ステップ1: WordPressに新しいフォームを作成する
まず最初に行う必要があるのは、WPFormsプラグインをインストールして有効化することです。詳しくは、WordPressにプラグインをインストールする方法のステップバイステップガイドを参照してください。
次に、新しいフォームを作成する必要があります。WPFormsと2,000以上のWordPressフォームテンプレートを使えば、いくつでもオンラインフォームを作成できます。
左側のパネルから右側のパネルにドラッグすることで、フォームにフィールドを追加することができます。
次に、フィールドをクリックして変更します。また、フォームフィールドをクリックしてドラッグし、オンラインフォームの順序を並べ替えることもできます。
覚えておいてほしいのは、どのタイプのオンラインフォームを作成しても、全ページを会話形式のコンタクトフォームにレイアウトできるということだ。
ステップ 2: Conversational Forms アドオンをインストールする
WordPress フォームの準備ができたら、WPFormsConversational Forms アドオンをインストールして有効化します。
このアドオンを使えば、新しく作成したWordPressフォームをインタラクティブフォームにすることができます。
これを行うにはWPForms"Addonsに行ってConversational Forms Addon と書かれたものを見つけてください。
アドオンのインストール]をクリックして、アドオンをインストールし、有効にします。
これで Conversational Forms アドオンを使う準備ができました。しかしその前に、気の散らない会話フォームを作成する前に設定しておきたい一般的なフォーム設定を簡単に見てみましょう。
ステップ 3: フォームの設定
フォームを思い通りにカスタマイズしたら、多くの設定を行うことができます。
一般設定
開始するには、設定"一般に進みます。
ここでは、フォームの名前、説明、送信ボタンのコピーなどを変更することができます。
また、不要なフォーム送信からウェブサイトを安全に保つために、追加のスパム防止機能を有効にしたり、フォームタグを追加したりすることもできます。
フォーム通知
Notificationは、あなたのウェブサイトでフォームが送信されるたびにメールを送信する素晴らしい方法です。
実際、この機能を無効にしない限り、誰かがあなたのサイトでフォームを送信すると、その通知が届きます。
この手順については、WordPressでフォーム通知を設定する方法をご覧ください。
自分自身、チームメンバー、サイト訪問者など、複数の通知を送信する必要がある場合は、WordPressで複数のフォーム通知を送信する方法のステップバイステップのチュートリアルをご覧ください。
また、メール全体のブランディングを統一したい場合は、メールテンプレートにカスタムヘッダーを追加する方法をご覧ください。
フォームの確認
フォームの確認とは、ウェブサイト上でフォームを送信するとサイト訪問者に表示されるメッセージです。フォームが処理されたことを知らせ、次のステップを知らせることができます。
WPFormsには3つの確認タイプがあります:
- メッセージ 誰かがあなたのウェブサイトのフォームを送信すると表示されるシンプルなメッセージです。
- ページを表示する。サンキューページなど、ユーザーをウェブサイトの別のページにリダイレクトします。
- URLへ移動(リダイレクト)。サイト訪問者を別のウェブサイトに移動させる。
サイト訪問者の行動に基づいて異なる確認を表示したい場合は、条件付きフォーム確認の作成方法をお読みください。
フォームの設定が完了したら、フォームビルダーの右上にある保存をクリックします。
ステップ 4: 会話型フォームの設定
フォームの一般的な設定ができたので、次は会話フォームの設定をしましょう。
これを行うには、フォームビルダーの設定"会話型フォームを開き、会話型フォームモードを有効にするオプションをオンにします。
そうすると、ニーズに合わせてカスタマイズできる設定がたくさん表示される。
フォームのタイトルとメッセージ
まず始めに、サイト訪問者に表示するフォームのタイトルをつけましょう。これはあなたのフォームが何なのか、どんな行動を取ってほしいのかを知らせるのに適しています。
次に、サイト訪問者のために短いメッセージを追加することができます。これにより、フォームに入力する際に何を期待すればよいかを知ってもらうための追加情報を追加することができます。
パーマリンク
オンラインフォームの会話フォームモードを有効にすると、会話フォームアドオンが自動的にユニークなパーマリンクを作成します。
このパーマリンクは変更してもいいし、そのままにしてもいい。
いずれにせよ、このURLはEメールキャンペーンや内部リンク、さらにはソーシャルメディアの投稿で、会話形式のリンクをクリックしてサイトを訪問してもらいたいときに使用します。
WPFormsはTypeformに代わる最高のツールです。
ヘッダーロゴ
インタラクティブフォームのランディングページをカスタマイズするために次にできることは、ロゴを追加することです。画像のアップロードをクリックし、フォームのランディングページに追加したい画像を選択します。
また、WPFormsのブランディングを隠す設定をオンにすることで、WPFormsのブランディングを削除することができます。
カラースキームとプログレスバー
WPForms Conversational Forms アドオンの最も優れた点のひとつは、あなたの会社のブランディングに合った配色でインタラクティブフォームランディングページをカスタマイズできることです。
選択した配色によって、フォームのランディングページとボタンの背景色が決まります。
そこで、どのような配色を選んでも見栄えが良くなるように、いくつかの素晴らしい配色を紹介しよう。
あらかじめ設定されている色が気に入らない場合は、カラーピッカーを使っていつでもカスタムカラーを選ぶことができます。
また、2つのプログレス・バー・スタイルから選ぶことができる:
- パーセンテージ:ユーザーがフォームに記入するまでの進捗をパーセンテージで表示します。
- 割合:ユーザーが完了したフォームフィールドの数を表示することで、あといくつの質問が残っているかを知ることができます。
会話型フォームのランディングページの設定がすべて完了したら、上部にある会話型フォームのプレビューボタンをクリックし、フォームが公開されたときにどのように表示されるかを確認することができます。
すべてが思い通りになったら、「保存」をクリックします。
これで、フォームが稼動し、投稿の受付を開始する準備が整いました!
次に、フォームの放棄を減らす
以上です!これでWordPressでインタラクティブフォームを作成する方法がわかりました。これで、あなたのインタラクティブフォームのランディングページへのユニークなURLやリンクを持つ人々が、それを表示し、入力することができるようになります。
フォームからの離脱に対抗する方法をもっとお探しなら、フォームからの離脱を減らして売上を上げるためのこの記事をご覧ください。
何を待っているのですか?今すぐ最強のWordPressフォームプラグインを使い始めましょう。
ちょっと混乱しています。 今作っているサイトにシンプルなフォームが必要でした。 WPフォームは完璧に見えました。 数分で最初のフォームを作りました。WPサイトでは、私自身のEメールが管理者として、また唯一のユーザーとして登録されています。 他のEメールを入力できる場所がなかったので、フォーム送信が完了したら受け取るものと思っていた)。 私のメールに届くと思っていた。 何か見落としているのでしょうか?
こんにちは、ジェシカ、
通常、メール配信に問題が発生した場合、WP Mail SMTPプラグインをインストールして問題を解決することをお勧めします。、インストール方法のガイドをご覧ください。
参考になれば幸いだ!
パーマリンクを使用するのではなく、サイトの別のページに会話型フォームを埋め込むことはできますか?埋め込もうとすると、タイプフォームのような会話形式ではなく、従来の形式に変わってしまいます。
また、自動で追加される「このフォームを完了するには、ブラウザでJavaScriptを有効にしてください」というメッセージを削除する方法はありますか?
Bri - 現在、会話フォームを通常のページに埋め込む機能はありません。機能リクエストトラッカーに載せておきます。とりあえず、Leads Forms アドオンを使ってみてください。
表示されているJavascriptエラーを修正するには、こちらのドキュメントをご覧になることをお勧めします。