AIサマリー
WordPressのページにWPFormsを追加する方法を学びたいですか？
私はしばらくの間、WPFormsを使ってきました。新規ユーザーからよく寄せられる質問の一つは、ビルダーで作成したフォームを実際のページにどう配置するかということです。
朗報です！WPFormsには5つの異なる方法があり、どれもわずか数クリックで完了します。このガイドでは、すべての方法を順を追って解説しますので、ご自身の環境に最適な方法をお選びいただけます。
WordPressのページにWPFormsを追加するには？
WPFormsを使えば、サイト内のどこにでも簡単にフォームを表示できます。
組み込みの埋め込みウィザード、WordPressのブロックエディタ、ショートコード、ウィジェット、あるいはElementorやDiviのようなページビルダーを利用できます。
以下で5つの方法をすべてご紹介します。どれを選べばいいかわからない場合は、まず方法1から試してみてください。これが一番手っ取り早い方法です。
始める前に
ページにフォームを追加する前に、2つの準備が必要です。
1.WPFormsのインストールと有効化
まだインストールしていない場合は、WordPressサイトにWPFormsプラグインをインストールしてください。WPForms LiteはWordPress.orgから無料でダウンロードできます。また、Pro版はご自身のアカウントからアップロードすることも可能です。サポートが必要な場合は、WordPressでのプラグインのインストール方法に関するこのステップバイステップガイドをご覧ください。
2. フォームを作成する
次に、WordPressダッシュボードの「WPForms」→「新規追加」に移動します。WPFormsにはドラッグ＆ドロップ式のフォームビルダー と2,100種類以上のフォームテンプレートが用意されており、すぐに使い始めることができます。テンプレートを選び、必要なフィールドをカスタマイズして、「保存」をクリックしてください。
設定はこれで完了です。それでは、フォームをページに配置しましょう。
方法 1: 埋め込みウィザードを使用する
これは、WPFormsをページに追加する最も手っ取り早い方法です。フォームビルダーから離れる必要すらありません。フォームを作成または編集したら、ビルダーの右上にある「埋め込み」ボタンをクリックしてください。
ポップアップが表示され、新しいページを作成するか、既存のページを選択するか、2つの選択肢が表示されます。
新しいページに埋め込む
フォーム用に新しいページを作成したい場合は、「新しいページを作成」をクリックしてください。ページ名を入力し、「さあ、始めましょう」をクリックしてください。
フォームがすでに埋め込まれた状態で、ページエディタに直接移動します。あとは「公開」をクリックするだけです。
既存のページに埋め込む
フォームを設置したいページがすでにありますか？「既存のページを選択」をクリックし、ドロップダウンからページを選んでください。
「Let’s Go」をクリックすると、そのページのエディタ画面に移動します。ここから、ページにWPFormsブロックを追加する必要がある場合があります（その方法については次の手順で説明します）。変更を保存するには、「更新」をクリックしてください。
方法 2：ブロックエディタを使用する
すでにページを編集していて、フォームを挿入したい場合は、WPFormsブロックを直接追加できます。
フォームを表示したいページを開きます。左上隅にあるプラス（+）アイコンをクリックして、ブロックライブラリを開きます。
「WPForms」を検索するか、ウィジェットセクションまでスクロールしてください。WPFormsブロックをクリックして、ページに追加してください。
次に、「フォームを選択」ドロップダウンから、表示したいフォームを選択してください。
フォームがエディタに直接表示されます。準備ができたら、「公開」または「更新」をクリックしてください。
WPFormsのブロック設定を構成する
フォームを追加すると、右側のサイドバーパネルに追加の設定項目が表示されます。
以下は調整可能な項目です：
- 「番組名」と「番組説明」：これらをオンにすると、フォーム入力欄の上にフォームの名前と説明が表示されます。
- フォームのスタイル設定：WPForms を使えば、CSS を記述することなく、ブロックエディタ上で直接フォームのスタイルを設定できます。フィールドのサイズや色、ボタンのスタイルなどを視覚的に変更できます。
- 上級者向け：フォームの外観をより細かく調整したい場合は、カスタムCSSクラスを追加してください。
方法 3：ショートコードを使用する
WPFormsでは、作成するフォームごとに固有のショートコードが生成されます。これは、クラシックエディタを使用している場合や、ブロックを完全にはサポートしていないテーマを使用している場合、あるいはショートコードが使用可能なその他の領域で作業する際に便利です。
フォームのショートコードを確認するには、WordPressダッシュボードの「WPForms」»「すべてのフォーム」に移動してください。各フォームの横にショートコードが表示されます。ショートコードは次のような形式になっています：
ショートコードをコピーし、フォームを追加したいページまたは投稿を開きます。「ショートコード」ブロックを追加し（クラシックエディタを使用している場合は直接貼り付けてください）、ショートコードを入力して、「公開」または「更新」をクリックします。
方法 4：ウィジェット（サイドバーまたはフッター）を使用する
サイドバーやフッターにフォームを表示したいですか？ウィジェットとして追加することができます。これは、ニュースレターの登録フォーム、簡易お問い合わせフォーム、あるいはサイト全体に表示すべきリード獲得フォームなどに最適です。
WordPressの管理画面で、「外観」＞「ウィジェット」に移動します。
フォームを設置したいウィジェットエリア（サイドバー、フッターなど）を見つけて、クリックして展開してください。
エディタの左上にあるプラス（+）ボタンをクリックし、通常のページと同じように「WPForms」ブロックを検索してください。
ドロップダウンからフォームを選択してください。
右上の「更新」ボタンをクリックして、ウィジェットの設定を保存してください。
実際のサイト上のフッターウィジェットに表示されるフォームは、以下のようになります：
より詳しい手順については、WordPressのサイドバーウィジェットに問い合わせフォームを追加する方法に関するガイドをご覧ください。
方法 5：ページビルダーを使用する
ElementorやDiviでページを作成する場合、WPFormsはどちらともネイティブに連携しています。ショートコードや回避策は必要ありません。
ElementorページにWPFormsを追加する
Elementorビルダーでページを開きます。左側のサイドバーにある「基本」セクションの下に、WPFormsウィジェットを探してください。それを、フォームを表示させたいページ上の場所までドラッグしてください。
ウィジェットの設定にあるドロップダウンからフォームを選択してください。Elementorは、ページ上でフォームのライブプレビューを表示します。
フォーム自体に変更を加える必要がある場合は、「選択したフォームを編集」リンクをクリックして、ポップアップウィンドウでフォームビルダーを開いてください。
すべてが問題なさそうであれば、Elementorビルダーの下部にある「公開」または「更新」をクリックしてください。
WPFormsは、フィールドの色、ボタンのスタイル、コンテナの背景色など、Elementor内でのフォームの全スタイル設定にも対応しています。
詳しい手順については、ElementorページにWPFormsを追加する方法に関するガイドをご覧ください。
DiviページにWPFormsを追加する
ページを開き、「Divi Builderを使用」をクリックしてビジュアルエディタを起動します。レイアウトを選択し、ページに新しい行を追加します。
Diviでモジュールの挿入を求められたら、「WPForms」を検索して選択してください。
モジュールの設定で、「フォームを選択」ドロップダウンから該当するフォームを選択してください。また、フォームのタイトルや説明を表示したい場合は、それらを表示する設定に切り替えることもできます。
緑色のチェックマークをクリックしてモジュールを保存し、ページを公開してください。スタイル設定や詳細なオプションについては、DiviページにWPFormsを追加する方法に関するガイドをご覧ください。
おまけ：フォームが埋め込まれている場所を追跡する
サイト全体にフォームを追加すると、それぞれの配置場所を把握するのが難しくなることがあります。WPFormsには、各フォームがどこに埋め込まれているかを正確に表示する機能が標準で備わっています。
「WPForms」→「すべてのフォーム」に移動します。次に、ページ上部の「画面オプション 」を開き、「場所」のチェックボックスにチェックを入れます。
これにより、すべてのフォームが表示されている表に、各フォームを追加した場所の数を示す列が追加されます。これをクリックすると、特定のフォームのすべての場所が表示されます。
こうすれば、サイト全体を探し回る必要がなく、お問い合わせフォームがどのページにあるかをいつでも確認できます。
WordPressへのWPFormsの追加に関するよくある質問
WordPressサイトにフォームを追加するのは簡単ですが、よく聞かれる質問がいくつかあります。ここでは、最もよくある質問をご紹介します。
なぜWPFormsのフォームがページに表示されないのですか？
確認すべき点がいくつかあります。まず、フォームを追加した後、実際にページを公開または更新したかどうかを確認してください。ショートコードを使用している場合は、フォームIDが正しいかどうかを再度確認してください。
ショートコードに誤字があると、何も表示されなくなります。また、キャッシュプラグインによっては古いバージョンのページが読み込まれる場合があるため、サイトのキャッシュを消去して、再度確認してみてください。
同じフォームを複数のページに追加することはできますか？
はい。同じフォームを、必要なだけ多くのページ、投稿、またはウィジェット領域に埋め込むことができます。このガイドで紹介するすべての方法は、サイト全体でフォームを再利用するために有効です。送信されたデータはすべて、引き続き「WPForms」＞「エントリー」の下に一箇所に集約されます。
どの埋め込み方法を使えばいいですか？
状況によって異なります。以下に簡単なガイドをご紹介します：
- 埋め込みウィザード：最も迅速な方法です。フォームを作成または編集し、すぐに公開したい場合に利用してください。
- ブロックエディタ：すでにページの編集を進めている場合に最適です。ブロック単位でのスタイル設定が可能です。
- ショートコード：クラシックエディタ、またはブロックではなくショートコードが使用可能な場所であればどこでも使用できます。
- ウィジェット：サイドバーやフッター用。サイトのすべてのページに表示されるべきフォームに最適です。
- ページビルダー：ElementorやDiviをご利用の場合、WPFormsのネイティブ統合機能により、すべての作業をビルダーのワークフロー内で完結させることができます。
次に、WordPressのフォームをカスタマイズしましょう
以上です！これで、WordPressのページにWPFormsを追加する5つの方法がわかりました。フォームが公開されたので、次にやっておくと良いことをいくつかご紹介します：
- 色、フォント、レイアウトのオプションを使って、フォームの外観をカスタマイズしましょう
- CAPTCHA、スパム防止トークン、および許可/拒否リストを使用して、お問い合わせフォームへのスパムを阻止する
- フォームへの送信内容をチーム内の適切な担当者に転送できるよう、複数のメール通知を設定する
フォームを作る準備はできましたか？最も簡単なWordPressフォームビルダープラグインで今すぐ始めましょう。WPForms Proにはたくさんの無料テンプレートが含まれており、14日間の返金保証がついています。
この記事がお役に立ちましたら、Facebookや TwitterでWordPressの無料チュートリアルやガイドをフォローしてください。
外部ページ（wordpressではない）に埋め込むコードを生成するためにフォームを埋め込む方法はありますか？
WPFormsはWordPressのプラグインです。これはWPFormsがWordPressのプラグインであるためで、WPFormsを使用するにはWordPressのサイトが必要です。
ありがとう。
商品ページのカートに入れるボタンの横に "リクエストボタン "ポップアップを表示するには？
ありがとう
Mohamamd - ご質問にできるだけ丁寧にお答えし、混乱を避けるために、私どものチームにご連絡いただけますか？
WPFormsのライセンスをお持ちの方は、メールサポートをご利用いただけますので、サポートチケットを送信してください。それ以外の場合は、WPForms Lite WordPress.orgのサポートフォーラムで限定的な無料サポートを提供しています。
ありがとう。
wpformsのコンタクトフォームは、ローカルのウェブサイトにあった場合、メールを送信しますか？
やあ、ハゼム、
はい、サイトがローカル環境でホストされている場合、通知メールを受信し、送信者に送信することができます。
作成したWPformをタブメニューに埋め込むことはできますか？ その場合、どのようにすればよいですか？
デイヴ - あなたのご質問にできる限り丁寧にお答えし、混乱を避けるために、私どものチームにご連絡いただけますか？
WPFormsのライセンスをお持ちの方は、メールサポートをご利用いただけますので、サポートチケットを送信してください。それ以外の場合は、WPForms Lite WordPress.orgのサポートフォーラムで限定的な無料サポートを提供しています。
ありがとう。
すべてのページに一度にフォームを追加するには？
申し訳ありませんが、すべてのページに一度にフォームを追加することはできません。
参考になれば幸いだ。
このガイドをありがとうございます。私のようなWordpress初心者にもとてもわかりやすく、理解しやすいです。チュートリアルはこの重要なトピックについて全く触れていません。敬具
マイケル - フォーム通知メールの設定方法については、こちらのドキュメントをご覧ください。メール配信を改善したい場合は、こちらのブログ記事をご覧ください。
会話フォームを特定のページに追加する方法はありますか？私の場合、ホームページに挿入したいのです（少なくとも会話フォームをホームページにしたいのです）。
機能リクエストトラッカーにはあるのですが、現在のところ会話フォームを特定のページに埋め込む機能はありません。代替案として、あなたの WordPress ウェブサイトでリードを獲得するための対話型フォームを作成できるLeads Form アドオンの使用を検討することができます。
Buongiorno, pur avendo correttamente inserito le email di whom de de deve ricevere la notification and essere suree le email sono corrette separandole with a virgola ... la email vengono ricevute solo dall'admin....
Come mai ?
リカルド - ご期待に添えず申し訳ありません。喜んでお手伝いさせていただきます。有料版をご利用の方は、こちらからサポートチケットをお送りください。また、ライト版をご利用の場合は、こちらからサポートスレッドを立ててください。
ありがとう。
リッカート尺度をダウンロードして手動でインストールするには？
シーナ -リッカート尺度フィールドを使用したい場合は、Survey and Polls アドオンを インストールする必要があります。詳細については、こちらのドキュメントをご覧ください。
woocommerceの商品ページにフォームを埋め込む方法はありますか？
Catamaraさん - 残念ながら現在Wooの商品ページにフォームを埋め込む方法はございません。しかし、機能リクエストリストにメモしておきましたので、引き続き検討させていただきます！ありがとうございます。
こんにちは、
ウェブフォームをインストールし、機能していますが、問い合わせが私のメールアドレスに届きません。
Tash-メール配信の問題に直面しているとのこと、大変申し訳ございません。この問題を解決するには、このドキュメントに従ってください。
お役に立てれば幸いです。他に質問があれば教えてください。ありがとうございました。