ChatGPTでWordPressフォームを作成する方法

ChatGPTでWordPressフォームを作成する方法

ChatGPTはすでにメールの作成、プロジェクトの計画、コードのデバッグを支援できます。では、WordPressフォームの作成も任せてみませんか?

適切な接続を設定すれば、ChatGPTに連絡フォームの作成、フィールドの追加、ラベルの編集、フォーム設定の更新を依頼でき、それらがすべてWPForms内で実行されるのを確認できます。

このガイドでは、ChatGPTでWordPressフォームを作成する方法を詳しく説明します。設定には数分かかりますが、一度完了すれば、フォームの作成は必要なものを説明するのと同じくらい簡単です。

WPFormsでChatGPTを使ってフォームを作成しましょう!🙂

ChatGPTでWordPressフォームを作成する方法

ChatGPTがあなたのサイトで動作するようにするには、WordPress MCPサーバー経由で接続します。最も簡単な開始場所は、WPFormsと同じチームの一部であるSeedProdの無料開始サーバー、WPVibeです。

私は自分のサイトでこれを設定しましたが、ChatGPTは1つのプロンプトから完全な注文フォームをWPFormsにドロップし、フィールドは私が説明したとおりに配置されました。

必要なもの

  • WordPressサイト(バージョン6.9以降)
  • WPFormsがインストールされ、アクティブになっていること(バージョン1.10.2以降)
  • アプリを含むChatGPTアカウント(ChatGPT Plus以上を意味します)

ステップ1:WPForms Proプラグインをインストールする

ChatGPTはWPForms内でフォームを作成するため、他の何よりも先にプラグインがサイトにインストールされている必要があります。すでにインストールされている場合は、次のステップに進んでください。

WPFormsは、600万以上のサイトで使用されている、WordPressで最も初心者向けのフォームビルダーです。ドラッグアンドドロップビルダーから独自のAIツールまで、すでにフォームを作成するための多くの方法を提供しています。

ChatGPTを接続すると、さらに1つの機能が追加され、WPForms Liteでは無料です。これは8つのフィールドタイプをカバーしていますが、すべてのフィールドタイプ、40以上の追加機能(支払い、アンケートなど)をアンロックするWPForms Proの使用をお勧めします!

WPFormsの価格ページです。

開始するには、サイトにWPForms Proをインストールしてください。サポートが必要な場合は、WordPressにプラグインを追加する方法に関するこれらの手順に従ってください。

WPForms Proを入手 🙂

ステップ2:AI MCPページからWPVibeをインストールする

ChatGPTがあなたのサイトを表示できるようにするには、あなたのサイトがフォームを公開する方法を持っている必要があります。その仕事は、WPFormsと同じチームの一部であるSeedProdの無料プラグイン、WPVibeが担当します。

WordPressダッシュボードを開き、WPForms » Toolsに移動してから、AI MCPタブをクリックします。AIアシスタントに関連するすべてがこのページにあり、現在必要なボタンと後で必要になるアクセス切り替えも含まれています。

WPForms のヘッダーにロゴとナビゲーションが表示され、AI MCP タブがメニューバーでオレンジ色の下線で強調表示されています。

Install & Activate WPVibeを押すと、WPFormsがプラグインをダウンロードし、オンにして、ページをリロードし、管理メニューにVibe AIエントリをドロップして、それが機能したことを確認できます。

Claude、ChatGPT、CursorとのWPForms AI連携を宣伝するプロモパネル。青い「WPVibeに移動」ボタンとMCP書き込みアクセス用のトグルが表示されます。

その下では、WPVibeはWordPress 6.9で導入されたWordPress Abilities APIに依存しており、承認されたツールがあなたのサイトでアクションを実行できるようになります。これらのアクションは自分で設定する必要はありません。

ホストがダッシュボードのインストールをブロックしている場合は、WordPress.orgからVibe AIを取得して通常の方法でアクティブ化し、詳細については完全なセットアップガイドを確認してください。

ステップ3:ChatGPTにWPVibeアプリを追加する

ChatGPTは他のアシスタントとは異なり、WPVibeは接続URLを貼り付けるのではなく、アプリディレクトリから追加するネイティブアプリです。ChatGPTはそこにあるアプリの操作方法をすでに知っているため、セットアップは迅速に行えます。

ChatGPTで、サイドバーからアプリを開き、WPVibeを検索します。アプリディレクトリは、ChatGPTがCanvaやBooking.comなどの外部ツールに接続する場所です。

ChatGPTアプリに移動し、wpvibeを検索してください

WPVibeアプリを開き、右上隅にある接続ボタンをクリックします。アプリページには、サイト上のコンテンツを作成および変更できるため、機能として書き込みがリストされていますが、ここではフォームにのみ必要です。

WPVibe製品ページ。左に円形のロゴ、ダーク背景にタイトルと説明、右に目立つ「接続」ボタンが表示されています。

ChatGPTにWPVibeを追加というタイトルのウィンドウが表示され、アプリがアクセスできるものを常に制御できることを思い出させる短いメモが表示されるので、続行するにはWPVibeでサインインをクリックします。

WPVibeとChatGPTの連携を発表するモーダル。「WPVibeでサインイン」ボタンがグラデーションブルーのカードに表示されています。

WPVibeサインインページでメールアドレスを入力すると、マジックリンクが送信されます。WPVibeからのメールを開き、サインインをクリックして完了します。リンクは15分で期限切れになることに注意してください。

WPVibeサインインメール。サインインを完了するための青い「サインイン」ボタンが表示されています(リンクは15分で期限切れ)。

マジックリンクでパスワードなしでサインインできるため、セットアップ中にWordPressのログイン情報をChatGPTと共有することはありません。

アプリは接続されていますが、ChatGPTはどのサイトで作業する必要があるかを知る必要があるため、1つのプロンプトでサイトを指定します。

新しいチャットで、実際のサイトアドレスを使用して「yoursite.comにある私のサイトを接続してください」と入力します。ChatGPTはサイトを接続し、WordPressのバージョン、アクティブなテーマ、サイトがAbilities APIをサポートしていることなどの詳細を表示します。

接続ステータスペネル。sulliesflowers.comへの接続が成功したことを示しています。URL、WordPress 7.0、PHP 8.2.24、アクティブテーマTwenty Twenty-Fiveが表示されています。

アプリがチャットでアクティブになると、メッセージボックスに小さなWPVibeチップが表示されるので、ChatGPTがサイトで作業していることがわかります。

フォームを確認するには、「私のフォームは何がありますか?」と尋ねます。ChatGPTはサイトを読み込み、すべてのフォームをリストします。これにより、エンドツーエンドの接続が機能していることが確認されます。

チャットGPTに、どのようなフォームがあるか尋ねる

ChatGPTがサイトやフォームを見つけられない場合は、WordPressサイトでWPVibeがアクティブになっていることを確認してから、接続プロンプトを再度実行してください。

ステップ5:WPFormsで書き込みアクセスを有効にする

この段階ではChatGPTはフォームを読み取ることができますが、フォームを作成するにはさらに1つの権限が必要です。書き込みアクセスはそれを許可するスイッチであり、WPFormsはデフォルトでそのスイッチをオフにしています。

読み取りと書き込みを分離するのは意図的であり、アシスタントは何も変更できないずっと前にサイトを調べることができます。

WPForms »ツール » AI MCPに戻ると、MCP書き込みアクセスを有効にするトグルがオフの位置にあります。オフの間は、フォーム作成ツールはChatGPTから非表示のままになります。

「お気に入りのAIでWPFormsを使用する」と表示されたダークマーケティングカード。青い「WPVibeに移動」ボタンと、「MCP WRITE ACCESSを有効にする」というラベルのトグルが表示されています。

トグルをオンにすると、保存済みインジケーターが表示されて確認されます。ChatGPTは、再接続や更新なしで、すぐにフォームの作成と編集を開始できます。

管理者はこのスイッチを切り替えることができるだけで、ChatGPTが行うすべての変更は、レビューのためにビルダーに保存されるため、常に制御下にあります。

ChatGPTを時々しか使用しない場合は、書き込みアクセスをオフにしておき、実際に必要な数分間だけオンにするのが良い習慣です。

ステップ6:ChatGPTにフォームの作成を依頼する

接続が有効で書き込みアクセスがオンになっていると、ChatGPTにプレーンテキストでフォームを依頼でき、WPFormsでフォームが構築されます。

チャットで、「名前、メールアドレス、電話番号、配達日、ブーケを選択するドロップダウン、配達先住所を含む花の配達注文フォームを作成してください」のようなプロンプトを入力し、送信します。

「ChatGPTにWPVibeを使用させますか?」というダイアログ。詳細が表示され、「拒否」、「一度だけ許可」(ハイライト表示)、「常に許可」ボタンがダークアプリ画面に表示されています。

ChatGPTはWPVibeを使用する前に許可を求めますので、何を行おうとしているのかを常に確認できます。リクエストを承認すると、フォームの構築が開始されます。

しばらくすると、ChatGPTはフォームが構築されたことを確認し、電話番号フィールドや配達日など、どのフィールドが追加されたかを通知します。

「フラワーデリバリー注文フォーム」の設定フォームが表示されているダーク管理画面。名前、メール、電話、配達日、ブーケ、配達先住所、公開ステータスなどのフィールドがあります。

WPForms » すべてのフォームを開くと、新しい注文フォームがそこにあり、すぐに開くことができます。これは通常のWPFormsフォームであり、手動で構築したものと同じなので、ビルダー内のすべての機能が機能します。

WordPressを離れたくない場合は、WPFormsビルダー内で同じようなプロンプトを使用して作成することもできます。また、Smart Editを使用して既存のフォームを編集することもできます。

プロンプトが明確であるほど、結果はそれに近くなります。必要なフィールドとその動作(配達日を必須にするなど)を指定すると、ChatGPTはそれに合わせて構築します。

ステップ7:フォームを確認して公開する

ChatGPTは完成したフォームを提供しますが、最後のステップは、公開する前に意図したとおりになっていることを確認することです。ビルダーでの簡単なレビューにより、ChatGPTが残したいくつかの項目を追加することもできます。

WPForms » すべてのフォームで注文フォームをクリックしてビルダーで開きます。フィールド、ラベル、順序が要求どおりであることを確認し、何か問題があれば手動で調整するか、別のChatGPTプロンプトを使用してください。

左側にフィールドパネル、右側に「フラワーデリバリー注文フォーム」というタイトルのフラワーデリバリー注文フォームが表示されているプレビューを備えたフォームビルダーUI。

ChatGPTはフィールドと基本的な設定を構築しますが、通知と確認は意図的にそのままにしておきます。

設定タブを開き、メール通知を設定して、各注文が正しい受信トレイに届くようにします。次に、顧客が注文後に表示する確認メッセージを作成します。

通知設定

ビルダー内でのフィールドの書き換えや条件付きロジックの追加など、より深い変更については、スマート編集がチャットパネルから直接処理します。

テスト注文も送信して、実際の顧客が行う前に受信トレイに届くものを正確に確認できるようにします。すべてが問題なければ、WPFormsブロックを使用してフォームをページに追加し、スタイルを設定します。

フォームテーマセクションの既製のテーマを選択することで、フォームのスタイリングをすばやく行うことができます。この例では、ジャングルテーマ(私のお気に入りの1つ)を使用しています。

すべての見た目に満足したら、エディターの右上にある公開ボタンをクリックします。注文フォームはサイトで公開され、単一のChatGPTプロンプトから構築され、注文を受け付ける準備ができました。

ページビルダーでフォームブロックと設定パネルが開いた状態でフラワーデリバリー注文フォームが表示されているWordPressエディター

WPFormsでChatGPTを使ってフォームを作成しましょう!🙂

ChatGPTでWordPressフォームを作成することに関するFAQ

ChatGPTをWordPressに接続してチャットでフォームを作成し始めたばかりのときに、よく寄せられる質問がいくつかあります。

コーディング方法を知る必要がありますか?

いいえ、セットアップ全体はポイントアンドクリックとチャットで行われ、コードやAPIキーは必要ありません。ChatGPTにWPVibeアプリを追加し、サインインして、目的のフォームを説明します。

有料のChatGPTプランは必要ですか?

アプリが含まれるChatGPTプランが必要です。これはChatGPT Plus以上で利用でき、WPVibeアプリ自体は無料で追加できます。

他にどのようなAIアシスタントが私のフォームを作成できますか?

ClaudeやCursorも利用可能です。WPVibeはModel Context Protocolを使用するあらゆるアシスタントをサポートしています。接続手順はアシスタントごとに若干異なりますが、結果は同じです。

ChatGPTに書き込み権限を与えるのは安全ですか?

はい、書き込み権限はオンにするまで無効になっており、管理者のみが有効にできます。いつでもオフに切り替えることができます。また、ChatGPTは変更ごとに許可を求め、実行したすべての操作はビルダーに表示されるため、確認できます。

ChatGPTは私のフォームで何ができませんか?

ChatGPTはフォームの作成、フィールドの追加・編集、フォームのタイトル、説明、送信ボタンの更新を行います。フォームの削除や、通知、確認画面、条件付きロジック、支払い設定の変更は行いませんので、これらはビルダー内で引き続きご自身で管理できます。

ChatGPTはどのようなフィールドを追加できますか?

ChatGPTは、名前、メールアドレス、電話番号、日付と時刻、ファイルアップロード、ドロップダウン、複数選択、チェックボックス、数値、段落テキストなどの一般的なフィールドに対応しています。これにより、注文フォームや登録フォームに必要なほとんどのものがカバーされます。

ChatGPTは私のフォームの入力内容も扱えますか?

はい、接続後、ChatGPTは入力内容を閲覧・検索し、単一の提出内容を表示できるため、注文に関する簡単な質問をすることができます。E

ntryへのアクセスは読み取り専用のままです。また、提出内容の分析や要約のために、ChatGPTでAI生成通知を送信することもできます。

次に、WordPress向けChatGPTツールをもっと探す

ChatGPTがフォームを作成するのは、両者が連携するいくつかの方法の1つです。WordPress向けの最高のChatGPTプラグインのまとめでは、コンテンツからサポートまで、AIをサイトに導入するその他のツールを紹介しています。

注文フォームを作成したばかりなので、WordPressで簡単な注文フォームを作成する方法に関するガイドも役立つかもしれません。このガイドでは、手動で微調整できるオプションについて説明しています。

WPFormsでChatGPTを使ってフォームを作成しましょう!🙂

フォームの作成準備はできましたか?最も簡単なWordPressフォームビルダープラグインで今日から始めましょう。WPForms Proには多くの無料テンプレートが含まれており、14日間の返金保証が付いています。

この記事がお役に立った場合は、FacebookTwitterでフォローして、WordPressの無料チュートリアルやガイドをさらにご覧ください。

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

ハムザ・シャヒド

ハムザはWPFormsチームのライターであり、デジタルマーケティング、サイバーセキュリティ、WordPressプラグイン、ERPシステムに関連するトピックも専門としています。もっと詳しく知る

最高のWordPressドラッグアンドドロップフォームビルダープラグイン

簡単、高速、安全。WPFormsを信頼する600万人以上のウェブサイト所有者に加わりましょう。