WordPressでオンライン注文フォームを作成する方法（2つの方法）

レストランや小規模なブティックのようなビジネスを経営している場合、オンラインストア全体を作成する必要はないかもしれません。

場合によっては、顧客に食品や限られた数の物理的な商品を簡単に注文できるようにしたいだけかもしれません。

シンプルな注文フォームがより良い選択肢となる状況は、本当に無限にあります。そこで、自分で作成するのに役立つ、最高の注文フォームのオプションを調査しました。

そのようにすれば、複雑すぎるeコマースソリューションを必要とせずに、顧客の注文を簡単に収集できます。

この投稿では、お気に入りのツールである WPForms と WP Simple Pay を使用して、これを実現する 2 つの簡単な方法を紹介します。早速始めましょう！

WordPressでオンライン注文フォームを作成する理由

複雑なオンラインストアを作成することは圧倒されるように聞こえますか？もしそうなら、多くの小規模ビジネスでは実際には必要ないことを知って安心するでしょう。

オンラインストアをセットアップして注文を受け付け、支払いを行い、在庫を管理するビジネスもあります。しかし、ショッピングカートを備えた複雑なeコマースウェブサイトは必要ないかもしれません。

例えば、レストランを経営している場合、オンラインストア全体を作成する必要はありません。販売している商品が数点しかない場合も同様です。

多くの場合、シンプルなオンライン注文フォームで十分です。

お客様がオンラインで支払う、受け取り時に支払う、または配達時に支払うように、フォームをカスタマイズできます。

ユーザーがオンラインフォームに入力すると、製品仕様、数量、配送情報、支払いオプションなどの必要なすべての詳細を入力できます。

これにより、正確な情報を受け取ることができ、注文プロセスが簡素化され、顧客エンゲージメントが向上し、収益の増加にもつながる可能性があります。

それでは、WordPressでオンライン注文フォームを簡単に作成する方法を見てみましょう。このチュートリアルでは2つの方法を説明します。お好みの方法にジャンプするには、以下のリンクを使用できます。

• 方法1：WPFormsで注文フォームを作成する（複数商品＆amp;高度な設定）
• 方法 2: WP Simple Pay で注文フォームを作成する (サブスクリプション & シンプル設定)
• 動画チュートリアル
• ボーナス：WordPressにレストラン予約システムを追加する
• よくある質問

方法1：WPFormsで注文フォームを作成する（複数商品＆amp;高度な設定）

アイテム画像を含み、ユーザーが一度に複数のアイテムを選択でき、商品をグループにソートできる高度な注文フォームを作成したい場合は、WPForms をお勧めします。

このプラグインを使用すると、コーディングスキルを必要とせずに、あらゆる種類のオンラインフォームを簡単に作成してウェブサイトに追加できます。さらに、CRM やメールマーケティングプラットフォームと簡単に連携できるため、成長中のビジネスに最適です。

WPBeginnerのウェブサイトでフォームを作成するためにWPFormsを何度も使用しましたが、一度も失敗したことはありません。それに関する私たちの経験について詳しくは、WPFormsレビューをご覧ください。

チュートリアルに入る前に、WPFormsには強力なAIフォームビルダーもあり、これまで以上に高速に高度なWordPressフォームを作成するのに役立つことを知っておくことが重要です。

今回はプラグインの既製の注文フォームテンプレートの使いやすさをお見せしたいので、これを使用しません。しかし、将来的に複数のフォームを作成する必要があることがわかっている場合は、非常に役立つ可能性があることを覚えておいてください。

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

プラグインを有効にした後、WordPressダッシュボードから「WPForms » Settings」ページにアクセスして、ライセンスキーを入力します。この情報は、WPFormsウェブサイトのアカウントで見つけることができます。

次に、WordPressダッシュボードからWPForms » 新規追加ページに移動します。

ここで「テンプレートの選択」ページに移動し、フォームの名前を追加することから始めることができます。次に、フォームテンプレートを選択する必要があります。「請求書/注文フォーム」テンプレートの使用をお勧めします。

このテンプレートを選択するには、カーソルを合わせるだけで「テンプレートを使用」ボタンをクリックしてください。

これで、WPForms のドラッグ＆ドロップエディターに移動します。ここでは、右側にフォームのプレビューが表示され、画面の左側の列にフォームフィールドが表示されます。

サイドバーからフィールドをドラッグアンドドロップして、オンライン注文フォームを自由に編集できるようになりました。

デフォルトのテンプレートには、名前、住所、電話番号など、必要となる情報のほとんどが含まれています。ただし、実際の商品をリストアップする必要があります。

これを行うには、「利用可能な商品」フィールドをクリックして編集します。これにより、左側の列に設定が開かれ、顧客が注文できる各商品の名前と価格を入力できます。

価格はフォームに自動的に表示されないため、商品名に追加することを検討してください。

追加オプションをさらに追加するには、追加アイテムを挿入したい場所にある(+)アイコンをクリックするだけです。(-)アイコンをクリックしてアイテムを削除することもできます。

注意: いくつでもアイテムを追加できます。ただし、顧客はこのフィールドから1つのオプションしか選択できません。

オプションのカテゴリがいくつかある場合は、フィールドをコピーしてグループを作成することを検討してください。

「利用可能なアイテム」フィールドは、カーソルを合わせたときや選択されているときに表示される「コピー」アイコンをクリックすることでコピーできます。

各グループに適した名前にフィールドの「ラベル」を変更することも忘れないでください。

1つのフィールドで顧客が2つ以上のオプションを選択できるようにしたい場合は、別のタイプのフィールドを使用する必要があります。

このためには、「フィールドを追加」タブに切り替え、「支払いフィールド」セクションまでスクロールダウンします。次に、「チェックボックスアイテム」フィールドを選択してフォームに追加します。

これで、以前のようにそのフィールドを編集し、アイテムの名前と価格を入力できます。顧客は注文したいアイテムをいくつでも選択できます。

製品の画像を表示したい場合も、簡単にできます。「画像選択を使用」スイッチを切り替えるだけです。

これを行うと、「画像をアップロード」ボタンが各アイテムの下に表示されます。

次に、コンピューターから、またはWordPressのメディアライブラリから好きなように画像を追加できます。

WPFormsは画像をリサイズまたは圧縮しないことに注意してください。そのため、適切なサイズでアップロードすることが重要です。すべて同じサイズで、250×250ピクセル以下である必要があります。

理想的には、画像をウェブ用に最適化することも行うべきです。

これで、残りのフォームフィールドを同様の方法でカスタマイズできます。それが完了したら、上部にある「保存」ボタンをクリックして設定を保存します。

注文フォームが送信する通知の設定

注文フォームを作成している場合は、通知を設定することをお勧めします。これにより、ウェブサイトで誰かが注文を行ったときにすぐにメールアラートを受け取ることができます。

これを行うには、左側の列から「設定」セクションに切り替え、「通知」タブをクリックします。デフォルトでは、完了した注文フォームはWordPressサイトの管理者アドレスにメールで送信されます。

ただし、これを変更したい場合や、注文フォームを複数のアドレスにコピーしたい場合があります。

「送信先メールアドレス」ボックスに、メールアドレスまたはアドレスを簡単に入力できます。複数のメールアドレスを入力する場合は、コンマで区切ってください。

注文ごとに同じにならないように、件名を変更することも検討してください。これにより、混雑したメール受信トレイで注文を追跡しやすくなる可能性があります。

ここでは、メールの件名を「お客様からのご注文」とし、その後に顧客名を表示するように変更しました。件名に名前フィールドを挿入するために「スマートタグを表示」を使用しました。

好みに応じて、他のすべての詳細を変更できます。

お客様にメール通知を設定することを強くお勧めします。これにより、注文した内容を思い出させ、注文を受け取ったことを知らせることができます。

新しいメール通知を設定するには、「新規通知を追加」ボタンをクリックします。

新しい通知の名前を入力するように求められます。

顧客はこの名前を見ないので、好きなように呼んでください。「顧客レシート」や「顧客メール確認」のような名前をお勧めします。

「送信先メールアドレス」は、お客様のメールアカウントにする必要があります。これは、このボックスから {admin_email} を削除する必要があることを意味します。

次に、「メール」フィールドを選択します。

メールに関するその他の詳細も入力します。件名は「ご注文は」と会社名を使用することをお勧めします。

「メールメッセージ」フィールドには、お客様へのメッセージを追加することになるでしょう。

{all_fields}タグは、顧客がフォームに入力したすべての情報を提供します。詳細な手順については、WordPressフォーム送信後に確認メールを送信する方法に関するチュートリアルをご覧ください。

お客様向けの確認メッセージの設定

お客様にメールレシートを送信するだけでなく、画面上の確認画面を表示して、注文が送信されたことを知らせることもできます。

これは、設定 » 確認タブで行うことができます。

デフォルトの確認メッセージは、「お問い合わせいただきありがとうございます！まもなくご連絡いたします。」です。

これは好きなように変更でき、ビジュアルエディターを使用してテキストをフォーマットできます。

または、お客様をウェブサイトの「ありがとう」ページ、あるいはまったく別のウェブサイトにリダイレクトすることもできます。

確認メッセージを設定したら、画面上部の「保存」をクリックします。

注文フォームとの支払い統合（オプション）

注文フォームを通じて支払いを受け付けたい場合は、支払い処理業者と連携する必要があります。

WPFormsは、PayPal、Stripe、Square、Authorize.netを含む複数の人気決済プロセッサと非常に簡単に統合できます。顧客はPayPalアカウントを通じて支払うか、クレジットカードの詳細を入力して支払うことができます。

このチュートリアルではPayPalを使用しますが、Stripeの手順も同様です。

まず、フォームビルダーを終了する必要があります。これは、右上にある「X」をクリックすることで実行できます。保存されていない変更がある場合は、フォームを保存するように求められます。

次に、WordPressダッシュボードの「WPForms » Addons」ページに移動します。「PayPal Standard Addon」までスクロールダウンし、その下にある「Addonをインストール」ボタンをクリックします。

アドオンは自動的にインストールおよび有効化されます。

次に、**WPForms » すべてのフォーム**の下にあるフォームに戻ります。フォームビルダーが起動したら、「支払い」タブに切り替え、「PayPal Standard」オプションをクリックします。

次に、「PayPal Standard支払い」を有効にするスイッチを切り替えます。

次に、フォームの詳細を入力します。PayPalアカウントに関連付けられたメールアドレスを追加することから始めることができます。

「モード」ドロップダウンは「本番」のままにし、「支払いタイプ」は「製品とサービス」のままにします。

注文フォームで配送先住所を収集している場合は、「配送」を「住所を尋ねない」に変更できます。

「キャンセルURL」を入力する必要はありませんが、チェックアウトプロセスを完了しなかった場合に顧客を送信するウェブサイト上のページを作成することをお勧めします。

入力が完了したら、「保存」ボタンをクリックします。

これで、ユーザーがフォームを送信すると、自動的に PayPal にリダイレクトされて支払いが行われます。フォームに余分なフィールドを追加したり、他に何もする必要はありません。

詳細については、WordPressでPayPal支払いフォームを追加する方法に関するチュートリアルをご覧ください。WordPressでPayPal支払いフォームを追加する方法。

ウェブサイトに注文フォームを追加する

最後のステップは、注文フォームをウェブサイトに追加することです。

フォームを追加したいページを選択するか、ページ » 新規追加 で新しいページを作成します。

次に、「ブロックを追加」（+）ボタンをクリックして新しいブロック（フォームを配置したい場所）を追加し、WPFormsブロックを見つけます。ブロックの「ウィジェット」セクションの下にありますが、検索バーに「WPForms」と入力して見つけることもできます。

WPForms ブロックが表示されます。「フォームを選択」ドロップダウンをクリックし、フォームを選択します。

その後、WordPressエディターでフォーム自体のプレビューが表示されます。

準備ができたら、ページを保存して公開（または更新）します。サイトでライブ表示して、フォームが機能していることを確認できます。顧客と共有する前に、期待どおりに機能することを確認するためにフォームをテストすることをお勧めします。

詳細については、WordPressにフォームを埋め込む方法に関するガイドを参照してください。

フォームが送信されたときにメール通知を受け取ることも確認しておくと良いでしょう。もし受け取れない場合は、WordPressのメール送信問題を解決する方法に関する投稿をご覧ください。

メールを見逃したり、誤って削除したりした場合でも、WPFormsはWordPressデータベースにフォームデータを保存します。WordPressダッシュボードのWPForms » Entriesに移動すると、すべての注文を見つけることができます。

エントリのリストを表示するには、フォームの名前をクリックします。詳細を表示するには、これらのいずれかの横にある「表示」をクリックします。

方法 2: WP Simple Pay で注文フォームを作成する (サブスクリプション & シンプル設定)

定期支払いまたはサブスクリプションをサポートするStripeと連携したシンプルな注文フォームを作成したい場合は、WP Simple Payをお勧めします。

また、製品数が限られており、複雑にしすぎずに購入制限を設定したい場合にも最適です。これにより、少数の製品やサービスを提供しているビジネスに特に適しています。

多数の支払いオプションと統合でき、直感的なフォームビルダーを備え、既製のテンプレートを提供します。このツールをさまざまなシナリオで徹底的にテストしましたが、非常に気に入りました。

当社のテスト体験に関する詳細については、WP Simple Pay のレビューをご覧ください。

まず、WP Simple Pay プラグインをインストールして有効化する必要があります。詳細については、WordPress プラグインのインストール方法に関するチュートリアルを参照してください。

プラグインをアクティブ化すると、画面にセットアップウィザードが表示されます。「開始する」ボタンをクリックしてください。

次に、プラグインのライセンスキーを追加する必要があります。

この情報は、WP Simple Payウェブサイトのアカウントで見つけることができます。

その後、プラグインをStripeに接続するように求められます。これにより、オンライン決済を簡単に受け付けることができます。

WP Simple PayはStripeプラグインであるため、新しいStripeアカウントまたは既存のStripeアカウントと連携しないと、ウェブサイトでは機能しないことに注意してください。

プロセスを開始するには、「Stripeで接続」ボタンをクリックします。

ステップバイステップの手順については、WordPressでStripe決済を受け付ける方法に関するチュートリアルをご覧ください。

StripeとWP Simple Payの接続に成功すると、セットアップウィザードでメールの設定を求められます。

ここでは、支払いレシート、今後の請求書、支払い通知のメール通知を受信するオプションを有効にできます。これらのメッセージを送信する必要があるメールアドレスも入力する必要があります。

次に、「保存して続行」ボタンをクリックし、好みに応じてセットアップウィザードの残りの手順を完了してください。

次に、WordPressダッシュボードの「WP Simple Pay » 支払いフォーム」ページに移動します。

ここで、「支払いフォームを作成」ボタンをクリックするだけです。

これにより、「テンプレートの選択」画面に移動し、プラグインが提供する既製のテンプレートのリストが表示されます。

必要に合った注文フォームテンプレートを見つけるために、「製品とサービス」タブに切り替えることをお勧めします。そこには、清掃サービス、洗濯サービス、武道レッスン、ウォーキングツアー、プール清掃などのフォームテンプレートがあります。

特定のニーズに合った既製のテンプレートが見つからない場合は、「支払いフォーム」オプションの使用をお勧めします。その下にある「テンプレートを使用」ボタンをクリックするだけです。

これで、「新しい支払いフォームを追加」ページに移動します。ここで、フォームのタイトルと説明を追加することから始めることができます。

たとえば、ユーザーの住所にフルーツバスケットを配達するための注文フォームを作成している場合、決済フォームを「Home Delivery Payment Form」のように呼び出すことができます。

その後、フォームの種類を「オンサイト支払いフォーム」として選択します。スパムエントリからフォームを保護するために CAPTCHA を有効にすることもできます。

次に、左側の列から「支払い」タブに切り替え、「税金徴収」オプションの下のドロップダウンメニューから希望する税金徴収率を選択します。

次に、フォームで販売する予定の商品に価格を追加します。

注文フォームで複数の商品を販売したい場合は、「価格を追加」ボタンをクリックして別のセクションを追加するだけです。これで、好みに応じて各製品にラベルを追加できます。

WP Simple Payはデフォルトで金額を表示しないため、製品の価格をラベルセクションに入力することも推奨します。

次に、「金額」セクションで製品の価格を追加し、通貨を選択します。

ユーザーが製品の購読を選択できる注文フォームも作成したい場合は、「サブスクリプションとしてオプションで購入できる価格を許可する」オプションにチェックを入れてください。

これにより、支払いフォームに定期購読チェックボックスが追加されます。ユーザーがそのオプションを選択すると、毎月支払いを受け取り、毎月製品を配送する必要があります。

その後、「支払い方法」セクションまでスクロールし、ドロップダウンメニューから「すべて」オプションを選択します。

これで、カード、ACHダイレクトデビット、Klarna、Cash App、GrabPay、iDEALなど、その他多くのオプションを支払い方法として、横のチェックボックスをオンにすることで追加できます。

支払い方法オプションを選択したら、「フォームフィールド」タブに切り替えます。これで、ドロップダウンメニューからフォームフィールドを追加し、タブを展開して設定を構成できます。

ドラッグアンドドロップで既存のフィールドを並べ替えることもできます。

例えば、物理的な商品を配送する予定がある場合は、フォームに住所フィールドを追加してカスタマイズできます。これにより、顧客は購入時に自宅の住所を入力する必要があります。

次に、「購入制限」タブに切り替えます。ここで、「指定された支払い数後に支払いフォームを非表示にする」ボックスをチェックして、値を入力できます。

この機能は、販売したい製品の数が決まっていて、売り切れを防ぎたい場合に非常に便利です。たとえば、フルーツバスケットを販売していて、20 個しか在庫がない場合、それを上限として設定できます。20 件の注文に達すると、フォームは自動的にサイトから消えます。

特定の日付以降にフォームを表示または非表示にするようにスケジュールすることもできます。これは、季節商品向けの注文フォームを作成している場合に特に役立ちます。

例えば、クッキーを販売していて、季節限定でクリスマス クッキーを提供する予定であれば、需要がある時期にのみ表示されるように、支払いフォームのスケジュールを設定できます。

次に、左側の列から「確認ページ」セクションに移動します。

ここで、ユーザーが注文を完了したときに画面に表示される成功メッセージを入力できます。また、配色を選択したり、ヘッダー画像を追加したりして、このメッセージをカスタマイズすることもできます。

その後、「メール通知」タブに切り替えて、ユーザーが支払い領収書とともに受信するメッセージを追加します。

この支払いフォームで支払いが行われたときに、自分に通知するカスタムメールメッセージを追加することもできます。

ウェブサイトに注文フォームを追加する

最後に、「支払いページ」タブに移動し、「専用支払いページを有効にする」ボックスをチェックします。

プラグインは、支払いフォームのカスタムページを生成します。これにより、新しいページを手動で作成する必要がなくなります。

支払いフォームページをカスタマイズするには、パーマリンク、配色、画像、フッターテキストを追加できます。

次に、「公開」ボタンをクリックして設定を保存します。

これで、WordPress サイトにアクセスして、オンライン注文フォームが実際に動作しているのを確認できます。

ただし、フォームを追加したい既存のページがある場合は、カスタムメールメッセージを追加した後、「公開」ボタンをクリックしてください。

次に、支払いフォームを追加したいページまたは投稿を見つけて、WordPressコンテンツエディターで開きます。次に、左上隅にある「ブロックを追加」（+）ボタンをクリックして、ブロックメニューを開きます。

ここから、WP Simple Payブロックをページに追加し、ブロック内のドロップダウンメニューから作成した支払いフォームを選択します。

その後、「更新」または「公開」ボタンをクリックして変更を保存します。

最後に、WordPress サイトにアクセスして注文フォームを表示します。

ボーナス：オンライン注文の追跡

ユーザーが注文フォームを使用して注文を開始すると、WordPress ダッシュボードから WP Simple Pay » アクティビティ & レポート ページにアクセスできます。

ここでは、サイトの最新の支払いアクティビティの概要を確認できます。今日のトランザクションの簡単なスナップショットを確認し、最新の 10 件をチェックできます。

さらに、プラグインを使用すると、任意の期間のレポートを生成できます。開始日と終了日を選択すると、支払い方法、支払いステータス、および成功した支払いの内訳を含む詳細な分析が表示されます。

これにより、注文フォームをより効果的に管理できます。

動画チュートリアル

ビデオでの手順に沿って進めたい場合は、以下のYouTubeチュートリアルをご覧ください。

WPBeginnerを購読する

ボーナス：WordPressにレストラン予約システムを追加する

レストランのウェブサイトをお持ちの場合は、予約システムを追加することも検討してください。

便利なオンライン予約オプションを提供することで、顧客体験を向上させることができます。電話予約の必要性を最小限に抑え、長い保留時間を短縮できます。

その方法については、WordPressでレストラン予約システムを追加する方法に関するチュートリアルをご覧ください。

よくある質問：WordPressでオンライン注文フォームを作成する

WordPress でオンライン注文フォームを作成することについて、読者からよく寄せられる質問をいくつかご紹介します。

WPFormsとWooCommerceで注文フォームを使用する際の違いは何ですか？

シンプルな注文フォーム（カスタム見積もり、サービス予約、または一度限りの商品注文など）が必要な場合は、WPForms が最適な選択肢です。軽量で設定が簡単で、完全なショッピングカートシステムは必要ありません。

一方、WooCommerceは本格的なeコマースプラグインです。多くの商品、カテゴリ、配送オプション、税金計算があるストアに適しています。

ただし、注文と支払いを収集するための基本的なフォームが必要なだけの場合は、過剰になる可能性があります。

注文フォームが送信されたときにメール通知を送信できますか？

はい、ほとんどのフォームプラグインでは、誰かがフォームを送信した後に自動的にメール通知を送信できます。WPFormsとWP Simple Payを使用すると、次のように送信するように設定できます。

• お客様への確認メール
• あなたまたはあなたのチームへの新しい注文通知
• エントリのコピーを別のメールアドレスに送信（必要な場合）

メールコンテンツをカスタマイズして、名前、注文詳細、支払い情報などのフォームフィールドを含めることができます。これは、コミュニケーションを合理化し、新しい注文に迅速に対応するための優れた方法です。

モバイルフレンドリーな注文フォームを作成することは可能ですか？

もちろんです！WPFormsやWP Simple Payを含むほとんどのモダンなフォームプラグインは、デフォルトでモバイルレスポンシブです。これは、注文フォームが電話やタブレットのような小さな画面に自動的に調整されることを意味します。

最適なユーザーエクスペリエンスを確保するために、WordPress のブロックエディターまたはフォームビルダーのプレビューツールを使用して、さまざまなデバイスでフォームをプレビューできます。

また、フォームは短くシンプルに保ちましょう。フィールドが少ないほど、モバイルでのコンバージョン率が高くなります。

これで完了です！この記事でWordPressでオンライン注文フォームを作成する方法を学べたことを願っています。また、究極のWordPress eCommerceセットアップガイドや、最高のWordPressクーポンコードプラグインも気に入るかもしれません。

この記事が気に入ったら、WordPressのビデオチュートリアルについては、YouTubeチャンネルを購読してください。 TwitterやFacebookでもフォローできます。