AI要約
WPForms の支払いフォームを強化する方法をお探しですか？合計フィールドをフォームに追加すると、トランザクションの精度が向上し、ユーザーエクスペリエンスが向上し、さまざまな支払いシナリオに対応できる汎用性の高いカスタマイズオプションを提供できます。
このチュートリアルでは、フォームに合計フィールドを追加する方法、フィールドを必須にする方法、ユーザーがフォームを送信する前に支払いの概要を表示する方法について説明します。
このチュートリアルに進む前に、WPForms が WordPress サイトにインストールされ、有効化されていることを確認してください。次に、新しいフォームを作成するか、既存のフォームを編集してフォームビルダーにアクセスします。
このフォームで支払いを受け付けたい場合は、支払いアドオンのいずれかがインストールされ、設定されていることも確認する必要があります。利用可能な各オプションの詳細なチュートリアルは以下にあります。
合計フィールドの追加
「合計」フィールドは、フォームビルダーの「支払いフィールド」セクションにあります。このフィールドをフォームに追加するには、クリックするか、ドラッグアンドドロップしてプレビューエリアに配置します。
支払い合計の必須化
WPForms の支払いフォームで合計フィールドを必須にすると、$0 の送信の問題を防ぎ、潜在的な混乱を排除し、すべてのトランザクションが意図的であることを保証します。
フィールドを必須にするには、まずプレビューエリアのフィールドをクリックしてフィールドオプションを開きます。「一般」タブで、「必須」オプションをオンに切り替えて、変更を保存します。
注意：公開する前にフォームをテストして、期待どおりに機能することを確認することをお勧めします。ステップバイステップのガイドについては、完全なフォームテストチェックリストを参照してください。
ユーザーが合計フィールドに $0 を入力したままフォームを送信しようとすると、「支払いが必須です。」という検証メッセージが表示されます。
注意: ユーザーがフォームを送信しようとしたときに合計フィールドの金額が $0 だった場合に表示されるメッセージを変更したいですか？検証メッセージのカスタマイズに関するチュートリアルをご覧ください。
注文概要の表示
支払いフォームに注文概要を表示すると、ユーザーは選択した製品の詳細な内訳をレシートのように確認できます。これは、合計費用に含まれるものについての誤解を防ぐのに役立ちます。
注意: 注文概要の表示には、WPForms バージョン 1.8.7 以降が必要です。
概要を表示するには、まずフォームプレビューエリアの「合計」フィールドをクリックして、フィールドオプションパネルを開きます。
「一般」タブで、「概要を有効にする」オプションをオンに切り替えます。
注意: クーポンアドオンを使用している場合は、最新バージョンに更新してください。そうしないと、注文概要機能を使用できなくなります。
注文概要を有効にすると、ユーザーは選択したアイテムとその価格の詳細な内訳をフォーム上で直接確認できるようになり、送信前に購入内容を透明性の高い概要で把握できます。
注意: 実用的な実装については、注文概要が組み込まれたこの高級腕時計注文フォームテンプレートをご覧ください。実際のシナリオで商品明細を効果的に表示する方法を示しています。
注文概要を確認メッセージに追加する
注文概要を確認メッセージに追加すると、ユーザーはフォーム送信直後に購入内容の明確な要約を確認できます。これは、ユーザーが購入したものを即座に表示し、透明性と顧客満足度を向上させるための優れた方法です。
確認メッセージに注文概要を含めるには、設定 » 確認に移動します。
次に、確認メッセージ後に注文概要を表示するオプションをオンにして、フォームを保存します。
これで、ユーザーがフォームを送信すると、確認メッセージとともに注文概要が表示されます。
よくある質問
送信前に、すべてのフォーム回答（支払い項目だけでなく）の概要をユーザーに表示できますか？
このチュートリアルで説明する注文概要機能は、支払い関連の項目と価格のみを表示します。ユーザーに、名前、メールアドレス、テキスト回答などの支払い対象外のフィールドを含む、フォームに入力したすべての内容の完全なテキスト概要を表示したい場合は、回答プレビューフィールドを使用できます。これにより、ユーザーはマルチページフォームの最後のページで、送信前にすべての回答を確認できます。設定手順については、WPFormsで回答プレビューを表示する方法のガイドをご覧ください。
これで完了です！フォームに合計金額フィールドを追加し、必須項目にして、ユーザーが送信を完了する前に支払い概要を表示する方法がわかりました。
次に、1つのフォームで複数の支払い方法を提供しますか？ユーザーが支払い方法を選択できるようにするガイドに従ってください。