WordPressでTypeformスタイルのフォームを作成する方法 (Step By Step) 

コードを1行も触らずにWordPressでTypeformスタイルのフォームを作成する方法を学びたいですか？

このガイドでは、WPFormsを使ってTypeformに代わるフォームを作成する方法を紹介します。

Typeformのような美しい一問一答フォームが、埋め込みコードや外部アカウントを使わずにWordPress内でシームレスに動作するようになります。

WordPressでTypeformを作成する簡単な手順：

さらに、WPFormsはWordPress内でフォームを作成できるので、サイトを離れることなくフォームを公開することができます。そして、既製のフォームテンプレートは、わずか数回のクリックで任意のタイプのフォームを作成するのに役立ちます。

これに加え、WPFormsにはドラッグアンドドロップビルダー、条件ロジック、会話型フォームが含まれている。つまり、WordPress内でTypeformに代わる独自のフォームを作成することができるのだ。

このガイドでは、Typeformのようなフォームを作成するために必要なすべての高度な機能を含むWPForms Proプランを使用します。無料版では私たちが必要とする会話型フォームのオプションは提供されていません。

詳しくはWPFormsのレビューをご覧ください。

WordPressでTypeformスタイルのWebフォームを作成する

Typeformと同じようなフォームを作成することは、アンケートをよりフレンドリーなトーンで行いたい場合に便利です。このようなフォームへの入力は、ほとんど友人と会話しているようなものです。そのため、ユーザーはあなたの質問に答え続ける可能性が高くなります。

さらに、会話型フォームは、質問を1つずつ表示することで、ウェブページの長さを短くします。これによって、ユーザーを飽きさせず、楽しく続けさせることができます。

また、ユーザーを退屈させるような長いフォームを作りたいときにも便利だ：

• 登録フォーム
• 求人応募フォーム
• 詳細なコンタクトフォーム
• 多肢選択問題調査
• オーダーフォームなど。
• ファイルアップロードフォーム

また、会話型のフォームにクリエイティブなセンスを加えることができるので、フォームの放棄を減らすことができる。

それでは、Typeform WordPressフォームの作り方を学びましょう。

ステップ1: WPFormsをインストールしてWordPressにTypeformスタイルのフォームを作成する

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

プラグインを有効化したら、WPForms " Settingsにアクセスしてライセンスキーを追加してください。

ライセンスキーはログイン後、WFormsアカウントエリアでご確認いただけます。

ライセンスを追加し、Verify Keyボタンをクリックします。

ステップ 2: WPForms Conversational Forms アドオンを有効にする

ライセンスキーを確認したら、WPForms 用Conversational Forms Addonを有効化する必要があります。

これを行うには、WPForms " Addonsにアクセスし、会話フォームオプションを見つけます。そしてアドオンのインストールをクリックします。

すると、ステータスが赤の非アクティブではなく、緑色のアクティブに変わることに気づくだろう。

このアドオンを使えば、WordPressのTypeformスタイルのフォームをゼロから作成したり、既存のフォームを会話型のフォームに変えることができます。

また、このチュートリアルではアンケートフォームを作成するため、高度なアンケート機能を利用するには、同じ手順に従ってSurveys & Polls Addonをインストールし、有効化する必要があります。

ステップ 3: Typeform のような新しい会話型アンケートフォームを作成する

会話型フォームは長いウェブフォームに最適ですが、ここではシンプルにTypeformスタイルのアンケートフォームを作成する方法を紹介します。

新しいアンケートフォームを作成するには、WPForms " 新規追加 に進みます。次のページでは、新しいフォームタイプをすばやく起動するために使用できるさまざまなフォームテンプレートが表示されます。

そして、便利なドラッグ＆ドロップ式のフォームビルダーを使えば、フォームフィールドやその他の要素をお好みにアレンジすることができます。

フォームを作成したら、設定ページに移動してフォームの設定を行います。

ステップ4: 会話フォームの設定とデザインをカスタマイズする

会話型フォーム機能を有効にするには、設定 " 会話型フォームにアクセスします。そして「会話フォームモードを有効にする」というチェックボックスを選択します。

この後、フォームページにタイトル、メッセージ、ロゴ、さらには配色を追加できるさまざまな設定が表示されます。

しかし、それだけではありません。通常のフォームを会話型フォームを含むランディングページにすることもできるのです。

まず、フォームにタイトルを付けましょう。ユーザーの注意を引くために、短く、説明的なものにしましょう。

次に、ユーザーが読み始める前に目にするカスタムメッセージを追加します。このスペースを使って読者を刺激し、続ける理由を与えましょう。

この後、パーマリンクの設定が表示されます。デフォルトでは、Conversational Forms Addon はアンケートの開始時につけた名前に基づいてパーマリンクを自動的に生成します。しかし、自分で入力することで簡単に変更することができます。

パーマリンクは覚えやすいように短く。

次のステップはロゴのアップロードです。これでフォームとブランディングの一貫性が保たれます。

ロゴファイルのアップロードを開始するには、[画像をアップロード]をクリックし、コンピュータまたはメディアライブラリにあるロゴファイルを探します。

また、Hide WPForms Brandingチェックボックスを選択すると、ライブフォームページでWPFormsに関する記述を非表示にすることができます。

また、ブランディングの一貫性を保ちたい場合は、配色セクションでページの色を選んでください。スポイトツールは、サイト全体で使用する正確な色を選ぶのに便利です。

最後のプログレスバーの設定では、フォームの完了をパーセントで表示するか、割合で表示するかを選択できます。

ステップ 5: WordPressにTypeformスタイルのフォームを保存して公開する

設定が完了したら、フォームエディターの一番上までスクロールし、会話フォームのプレビューをクリックします。そして、すべての見た目に満足したら、保存をクリックします。

これでフォームに入力する準備が整いました。先程作成したパーマリンクに人々を誘導するだけで、彼らはスタートを切ることができます。

パーマリンクをソーシャルメディアでシェアして、より多くの読者に届けることもできる。パーマリンクをコピーして、希望のソーシャルネットワークの投稿に貼り付けるだけです。

WordPressでTypeformスタイルのフォームを作成する際のFAQ

埋め込みコードをコピーしたり、外部ツールを使用することなく、WordPressでTypeformスタイルのフォームを作成する方法がわかりました。WPFormsを使えば、人々の関心を引きつけ、より良い回答を集めることができる、完全にブランディングされた会話型フォームを作成することができます。

また、フォームが表示されるページを完全に制御したい場合は、SeedProdでそれらを構築してみてください。WPFormsとシームレスに連携し、コンバージョンにつながるWordPressのランディングページを簡単にデザインできます。

フォームに関するより多くのヘルプについては、私の他のガイドがお好きかもしれません：

• WordPressでフォーム付きランディングページを作る方法
• カスタムフィールドを使ったWordPressユーザー登録フォームの作り方
• WordPressイベント登録フォームの作り方
• WordPressでマルチステップフォームを作成する方法
• WordPressファイルアップロードフォームの作り方
• WordPressサイトにオンライン注文フォームを作成する方法
• WordPressにお問い合わせフォームを追加する方法

お読みいただきありがとうございました！あなたのご意見をぜひお聞かせください。YouTube、X、Facebookで、あなたのビジネスを成長させるために役立つアドバイスやコンテンツを提供していますので、お気軽に会話にご参加ください。