Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPBカップ
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

WordPressで会話型フォームを作成する方法(Typeformの代替)

編集メモ: WPBeginner のパートナーリンクから手数料を得ています。手数料は編集者の意見や評価に影響を与えません。編集プロセスについて詳しく知る。

フォームをより人間的なものにし、ユーザーがフォームに入力する際の負担を軽減したいとお考えですか?

多くの読者から、WordPressでTypeformのようなフォームを作成する方法についてチュートリアルを書いてほしいというリクエストがありました。すべての質問を一度にリストアップする従来のお問い合わせフォームやアンケートフォームとは異なり、会話型フォームは対面での会話に似た一問一答のアプローチをとります。

この投稿では、WordPressで会話形式のフォームを作成する方法を紹介します。

How to Create Conversational Forms in WordPress Easily

WordPress用会話フォームプラグイン(Typeform代替)

以前はWordPressに特化した優れたソリューションがなかったため、WordPressサイトで会話型フォームを作成するのは困難でした。

いくつかのSaaSアプリケーションはこの機能を提供しており、中でもTypeformは最も人気があったが、いくつかの欠点があった:

  • TypeformはSAAS(Software as a Service)ツールであり、フォームのデータはサーバーに保存されます。つまり、データの安全性に関して他者を信頼することになります。
  • Typeformは中小企業にとっては高額だ。プレミアムプランは$25/ユーザー/月からで、より多くの機能を使いたい場合は$83/ユーザー/月になります。

Typeformは無料プランを提供していたが、制限が多すぎたため、WordPressユーザーにとっては魅力的ではなかった。

そこで私たちはWPFormsのチームにTypeformに代わるWordPress用のフォームの作成を依頼しました。WPFormsのConversational Formsを使えば、Typeformのような高いコストをかけずにインタラクティブなWordPressフォームを作成することができます。

WPForms Conversational Forms Addon

WPFormsは600万以上のサイトで使用されている最高のWordPressフォームプラグインです。また、市場で最もユーザーフレンドリーなフォームビルダーです。

この新規アドオンを使えば、どんなフォームも90秒以内に会話型フォームに変身させることができる。Typeformとは異なり、WPFormsはオープンソースのWordPressプラグインであるため、フォームデータはすべてサードパーティのアプリではなく、あなたのサイトに保存されます。

WPFormsはTypeformよりも費用対効果が高い。年間プランを199.50ドルで購入することができ、無制限のフォームやアンケート、会話型フォームを含むその他の強力な機能を利用することができます。

WordPressサイトで会話形式のフォームを簡単に作成する方法を見てみましょう。

情報開示:WPFormsはWPBeginnerの開発チームによって作成されました。それは私たちのプレミアムWordPressプラグインの一つです。

動画チュートリアル

Subscribe to WPBeginner

動画が気に入らなかったり、もっと説明が必要な場合は、このまま読み進めてください。

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

まず最初にWPFormsプラグインをインストールして有効化します。詳しい手順については、WordPressプラグインのインストール方法のステップバイステップガイドをご覧ください。

Conversational Forms Addon’にアクセスするには少なくとも ‘Pro’ プランが必要です。WPBeginnerユーザーはWPFormsクーポンを使ってWPFormsライセンスをすべて50%OFFで購入できます。

プラグインを有効化したら、WPForms ” 設定ページにアクセスしてライセンスキーを確認する必要があります。この情報はWPFormsサイトのアカウントエリアにあります。

WPForms license

次にWPForms ” Addonsページで Conversational Forms アドオンを探します。

アドオンのインストール」ボタンをクリックするだけです。

Install Conversational Forms addon by WPForms

プラグインは数秒以内に Conversational Form アドオンをインストールして有効化します。

アドオンの状態が「有効化」と表示されたら、使用を開始できることを意味します。

WPForms Conversational Forms addon active

WPFormsで作成された新規または既存のフォームで会話型フォームを有効化することができます。

会話型フォームはフォームの放棄を減らすのに有効である。双方向性と対面式の会話アプローチは、フォーム完了率の向上につながります。

これは以下のようなフォームに非常に効果的である:

これらのフォームは一般的に長く、より多くのフィールドを含みます。これらの質問をすべて一度に表示すると、ユーザーは圧倒され、フォームを放棄してしまいます。

会話型フォームは、ユーザーに一度に1つの質問に答えてもらうことで、この問題を解決します。退屈な長いフォームの代わりに、よりインタラクティブに感じられ、ユーザーを飽きさせません。

この例では、会話形式のアンケートフォームを作成する方法を紹介します。

まず、通常のアンケートフォームを作成する必要があります。これは WordPress 管理エリアのWPForms ” 新規追加をクリックすることで行うことができます。詳細については、WordPress でアンケートを作成する方法のステップバイステップガイドを参照してください。

WPForms survey templates

WPFormsでフォームを作成するのは、そのシンプルなドラッグアンドドロップインタフェースを使用して簡単です。あなたは右側のフォームエディターに左側のフォームフィールドをドラッグすることができます。

例えば、WPFormsのアンケートフォームエディターのサンプルはこんな感じです:

Editing Survey Form with WPForms

アンケートの質問を追加したら、左側のパネルの設定 ” 会話型フォームタブに移動します。

Enable Conversational Form Mode’ボックスをチェックする必要があります。

Enable Conversational Form Mode in WPForms

その後、会話フォームの設定とカスタマイザーオプションが表示されます。

これらのオプション設定により、ロゴ、配色、メッセージを使った魅力的な会話形式のランディングページをデザインすることができます。

Conversational Form Landing Page Options WordPress

フォームはいつでもプレビューできます。

会話フォーム設定の右上にある「会話フォームをプレビュー」ボタンをクリックするだけです。

Preview button for Conversational Forms WordPress

最初に、会話フォームのタイトルフィールドが表示されます。

そこにフォームの短い説明的なタイトルを入力することができます。例えばアンケートにご協力ください!

WPForms Conversational Form Title

次に、「メッセージ」フィールドまでスクロールダウンします。

ここでは、ユーザーにフォームへの入力を促す短いメッセージを追加することができます。

Conversational Form Landing Page Message

下にスクロールすると、パーマリンクのオプションが表示されます。

パーマリンクは会話フォームのランディングページのユニークなURLです。プラグインはフォームのタイトルを使って各会話フォームのパーマリンクを自動的に作成します。必要に応じて変更できます。

Conversational Form Page Permalink Option

パーマリンクを設定する際は、メールキャンペーンやソーシャルメディア投稿でこのURLを使用する可能性があるため、短くシンプルなものにすることをお忘れですか?

会話フォームページをカスタマイズするために次にできることは、ヘッダーロゴを追加することです。Upload Image’ボタンをクリックし、アップロードする画像を選択します。

Upload Header Image in Conversational Form Landing Page

その下にWPFormsのブランディングを非表示にするチェックボックスの設定があります。フォームのランディングページに’powered by WPForms’のメッセージを表示したくない場合は、’Hide WPForms Branding’の隣にあるチェックボックスにチェックを入れてください。

右上の「会話形式のプレビュー」ボタンをクリックすると、ブランディングの外観をプレビューできます。

WPForms Branding in Conversational Form Landing page

その後、フォーム送信ボタンとページ背景をカスタマイズする配色オプションがあります。

あらかじめ設定された色のいずれかを使用するか、カラーピッカーを使用して新しい色を選択することができます。

Choose a Color Scheme for Your Conversational Form Page

最後に、プログレスバーの設定です。

2つのスタイルから1つを選択できます:パーセンテージとプロポーション。

WPForms Conversational Form Progress Bar Options

各プログレス・バー・スタイルがどのように見えるかを確認したい場合は、スタイルを1つずつ選択してフォームをプレビューすることができます。

またはスクリーンショットをご覧ください:

Conversational Forms Progress Bar Styles - Percentage vs. Proportion

会話フォームの設定がすべて完了したら、プレビューして実際のサイトでどのように見えるかを確認することができます。

次に、上部にある「保存」ボタンをクリックして、設定を保存します。

Save Conversational Form Landing Page Options

それだけだ!

次に、会話フォームを任意のページや投稿に追加することができます。ページを編集するか、新規ページを追加してください。

コンテンツエディターに入ったら、WPFormsブロックを追加し、ドロップダウンメニューからフォームを選択するだけです。

WPForms block

これで、ブラウザーで会話フォームのリンクを開き、その動作を確認することができます。

会話型アンケートフォームのページはこんな感じでした:

Conversational Form Landing Page Preview

会話型フォームのランディングページの準備ができたら、WordPressのナビゲーションメニューにリンクを追加し、メールキャンペーン、ソーシャルメディア更新、ブログ投稿で使用することができます。

WordPress で会話型フォームを簡単に作成する方法について、この投稿がお役に立てれば幸いです。WordPress でフォームのコンバージョンをトラッキングする方法や、WordPress のエキスパートが選ぶ最高の SEO プラグインとツールもご覧ください。

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

情報開示 私たちのコンテンツは読者支援型です。これは、あなたが私たちのリンクの一部をクリックした場合、私たちはコミッションを得ることができることを意味します。 WPBeginnerの資金源 をご覧ください。3$編集プロセスをご覧ください。

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

究極のWordPressツールキット

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

Reader Interactions

11件のコメント返信を残す

  1. Syed Balkhi says

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

  2. Becky Antkowiak, beckyantkowiak.com says

    I’m in the very beginning stages of forming a nonprofit; there’s not a free plugin that does this, is there?
    Also, just as an FYI, in another article, I didn’t see a comment option, but it refers to CSS Hero plugin–I couldn’t find that plugin in WP. Not sure if I’m doing something wrong.

    • WPBeginner Support says

      If you mean conditional logic you can set that up with WPForms but for questions about what is offered by the plugin, you would want to reach out to the plugin’s support :)

      管理者

    • WPBeginner Support says

      Thanks for the feedback, that is something WPForms can look to add as a feature in the future.

      管理者

返信を残す

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