WordPressのフォームにオプション決済を追加する方法

訪問者がフォームに入力する際に、非営利団体への寄付を選択できるようにしたいですか?条件付きロジックを使えば、ユーザーが特定のオプションを選択しない限りフィールドを隠すことができます。

そこでこの記事では、WordPress のフォームにオプションの支払いを追加する方法を説明します。ビデオチュートリアルをご覧になりたい方は、下の再生ボタンをクリックしてください。

書面による指示を希望される方は、このまま読み進めてください。

ステップ1:フォームフィールドの追加

まず最初に行う必要があるのは、WPFormsプラグインをインストールして有効化することです。WordPressのプラグインをインストールする方法のステップバイステップガイドはこちらです。

また、フォームを作成する必要があります。チュートリアル「シンプルなお問い合わせフォームの作り方」をご覧ください。フォームの種類は問いませんが、このチュートリアルではお問い合わせフォームを使用します。

デフォルトのコンタクトフォームには、名前、Eメール、コメントまたはメッセージフィールドがあります。また、フォームに複数選択肢 単一項目フィールドを追加する必要があります。

お問い合わせフォームに複数選択肢フィールドと単一項目フィールドを追加し、任意の支払いを行う

フォームビルダーの右側のパネルにフィールドをドラッグ&ドロップするだけで追加できます。

クレジットカードフィールドも必要です。WPFormsはWordPressのStripeプラグインとしてシームレスに動作します。

実際、WPFormsはPayPalAuthorize.NetSquareと統合して支払いを受け付けることもできます。ユーザーが支払い方法を選択できるようにフォームを設定することもできます。

WPFormsのクレジットカードフィールド

必要なフィールドをすべて追加したら、カスタマイズを始めましょう。

Apple Payを有効にしたい場合は、 フォーム上でApple Pay決済を行うためのガイドをご覧ください。

ステップ 2: フォームフィールドのカスタマイズ

複数選択フィールドには3つの選択肢がありますが、オプションの支払いに必要な選択肢は2つだけです。右側のパネルでフィールドをクリックし、左側のパネルで3つ目の選択肢を削除すれば、3つ目の選択肢を削除することができます。

複数選択肢フィールドから選択肢を削除する

訪問者に寄付をするかどうかを尋ねることになるので、オプションパネルの複数選択フィールドのラベルも変更した方が良いでしょう。

ラベルは「寄付しますか」、選択肢は「はい、寄付します」と「いいえ、結構です」にします。

複数選択フィールドのラベルを変更し、ユーザーが寄付をするかどうかを決定できるようにする。

単一項目フィールドは、ユーザーが独自の寄付金額を入力できるように、ユーザー定義に 設定する必要があります。

単一項目フィールドをユーザー定義に設定する

寄付金額のカスタマイズにお困りの場合は、複数の金額を設定できる寄付フォームの作成方法をご覧ください。

ステップ3:条件ロジックを有効にする

フォームに任意の支払いを追加するには、まずクレジットカードフィールドの条件付きロジックを有効にする必要があります。

フィールドをクリックし、スマート・ロジック・タブを選択することで有効にできます。そこから、 Enable Conditional Logic オプションをクリックします。

次に、Would you like to donate? が Yesの 場合、このフィールドを表示するようにロジックを設定します。

Stripeクレジットカードフィールドに条件付きロジックを設定する

だから、寄付をしたくない人がいれば、クレジットカードの欄は表示されない。

ここで、訪問者が寄付を希望しない場合、支払いを処理しないように支払い統合に指示する必要があります。この例ではStripeを使用しますが、PayPal、Square、Authorize.Netを使用してもプロセスはほとんど同じです。

注:Stripe決済はWPFormsの全バージョンで利用可能でアドオンは不要ですが、Stripe決済フィールドの条件ロジック設定にアクセスするにはStripe Proアドオン(Pro以上で利用可能)が必要です。

まず、フォームビルダーの左にある支払いアイコンをクリックします。次に、支払いプロセッサーのオプションをクリックします。

Stripe決済の有効化

ここでは、すでに支払いを有効にし、設定を行ったと仮定します。次に、右側のペインで条件付きロジックを有効にする 設定をオンにします。その下に、ユーザーがNo, thanksを選択した場合は処理を行わないというルールを作成します。

任意の寄付のためのStripeの設定

これで、ユーザーが寄付フィールドに値を入力しても、「いいえ、結構です」を選択していれば、フォームからカードに請求されることはありません。

注文フォームの設定が完了したら、[保存]をクリックして変更内容を保存します。

エントリーの収集が始まったら、WPForms " Entriesでキーワードを検索するか、レシート番号のような寄付者の支払い詳細を検索することで投稿を見つけることができます。

支払詳細検索

これで完了です!これでWordPressのフォームにオプションの支払いが追加されました。

もしあなたのサイトに 非営利の寄付フォームを作るのにもっと助けが必要なら、私たちはそのためのガイドを別に用意しています!

次に、オンライン注文の処理を高速化

オンライン注文の支払いを受け付けたいですか?WordPressの注文フォームで支払いを処理する方法をご覧ください。

オンライン注文の処理時間をさらに短縮したい場合は、カレンダーソフトと連動した顧客予約フォームの作成方法についてのチュートリアルをご覧ください。

何を待っているのですか?今すぐ最強のWordPressフォームプラグインを使い始めましょう。

この記事が気に入ったら、Facebookや TwitterでWordPressの無料チュートリアルをフォローしてください。

情報開示私たちのコンテンツは読者支援型です。つまり、あなたが私たちのリンクをクリックした場合、私たちはコミッションを得る可能性があります。WPFormsがどのように資金を調達しているのか、なぜそれが重要なのか、そしてどのように私たちをサポートできるのかをご覧ください。

シャザド・サイード

チェンナイのアンナ大学を卒業後、2017年にAwesome Motive Inc.に入社し、WPFormsを含む同社のいくつかのブランドやプラグインのコンテンツを制作している。 もっと知る

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

簡単、速い、安全。WPFormsを信頼する600万人以上のWebサイトオーナーの仲間入りをしてください。

このフォームを入力するには、ブラウザのJavaScriptを有効にしてください。

70 comments on "WordPressのフォームにオプション決済を追加する方法"

    1. こんにちは、シャルク、

      現在、Instamojoとの統合はありませんが、将来の検討のために機能リクエストリストに追加しました。ご提案ありがとうございます🙂。

      1. こんにちは、Anurodh - 現在WPFormsにはRazorpayの統合がありません。開発チームが将来のロードマップで検討できるように機能要求を作成しました。ご提案ありがとうございます!

      1. こんにちは!申し訳ございませんが、お客様のご要望を完全に理解しているわけではありません。どうやら、お客様のカードに(レンタルや予約の保証金や担保として)「保留」を設定できるようにしたいようですね。私たちの支払い統合は、現在これを行うことはできませんが、私はあなたがそのような機能に興味を持っていることを指摘し、その機能要求にあなたの投票を追加しました。

        もし私が誤解しているようでしたら、追加で詳細を明らかにするため、あるいはさらにご質問がある場合は、ご連絡くださいᙂ。

        ありがとう!

    1. こんにちは、ケビン - 現在、この統合のオプションはありません。しかし、将来的に検討するために、機能リクエストリストに記載しておきました🙂。

  1. Paypalフォームの情報をエクスポートするにはどうすればよいですか。
    ステータスフィールドの情報が必要です。
    paypalに関連する他のトランザクションフィールドをwpformsにエクスポートまたは使用することはできますか?
    例えば、トランザクション番号、支払い金額、フィールドのステータス(完了または保留)、その他何でも結構です。

    エクスポートされた情報を使ってレポートを作成しようとしています。
    ありがとうございました。

    1. こんにちは、エリック、

      CSVエクスポートにこの情報を含めない理由は、動的に生成されるためです(PayPalから取得されるため、最新かつ最も正しい情報が表示されます)。しかし、この情報や他のPayPal関連データをエクスポートすると便利であることは理解できます。

      その他、何かお手伝いできることがありましたら、ご連絡ください!

  2. wpformsでPayPalやstripe以外の支払いゲートウェイを統合することは可能ですか?インドではどちらのゲートウェイも普及していません。

    1. こんにちは、プラシャン、

      現在のところ、StripeとPayPalとの支払い統合のみを行っており、近い将来これを拡張する予定はありません。しかし、もし機能リクエストフォームにご希望のオプションがありましたら、ぜひご記入ください。

      ありがとう! ᙂ。

      1. このオプションはインドでは使えないので、WPフォームとの統合で、インドで支払いに使えるより良いオプションを探しています。

      2. こんにちは、ビーナ、

        また、WPFormsの今後のアップデートを検討するために、あなたのコメントを機能リクエストとしてチームに転送させていただきます。

        ありがとう!

    1. ハイ、アリ、

      今はまだそのような方法はありませんが、機能リクエストリストにメモしておきました!ご提案ありがとうございます🙂。

    1. デズモンド、こんにちは、

      今はまだそのような方法はありませんが、機能リクエストリストにメモしておきました!ご提案ありがとうございます🙂。

      1. PaystackはアフリカでNo.1のオンライン決済プロセッサーです。
        もしそうでない場合、PaypalやStripeを使えないアフリカの顧客のために、決済を統合することはできますか?

      2. 現在、Paystackアドオンと統合された内蔵機能はありません。私たちのロードマップを計画し続ける中で、将来的に検討するためにメモを作成し、機能リストに入れました。

        コネクターサービスのZapierにはWPFormsとPaystackを接続する機能があるようですね。ZapierアドオンはPro以上のライセンスで利用可能です。

        お役に立てれば幸いです! 🙂。

      3. これはとても悲しいことだ。2024年現在、Wpformsはpaystackやアドオンを統合することさえできません。どうやらあなた方は気づいていて平然としているようだ。 ペイパルとストライプはアフリカでは利用できません。

      4. こんにちはケド、

        WPFormsは現在Paystack決済ゲートウェイをサポートしていません。しかし、WPFormsがサポートするゲートウェイにPaystackが加わることは素晴らしいことだと思います。

        この機能に関する要望が公開されていますので、あなたの投票を追加しました。私たちのチームは将来のリリースのためにこれらの要望を積極的に検討します。
        ありがとうございます!ᙂ。

    1. こんにちは、ルーカス、

      現在、クーポンコードをフォームに含める機能はありません。このスクリーンキャストに示されているように、これを設定するための可能な回避策があります。

      しかし、基本的には、2つのMultiple Itemsフィールド(1つは通常価格、もう1つは割引価格)を追加し、クーポンコードを受け付けるためのSingle Line Textフィールドも追加できます。最後のステップは、各項目フィールドに条件を作成することです。これを行うには、これらのフィールドの1つをクリックし、フィールドオプション画面を開きます。そこから、条件セクションを開き、「条件ロジックを有効にする」にチェックを入れます。

      フルプライスの商品の場合、ロジックはこのスクリーンショットのようになります。正しいクーポンコードが入力された場合、このフィールドは非表示になります。

      割引商品の条件ロジックは、同じ「クーポンコード」が入力されたときに表示されるように設定する。

      お役に立てれば幸いです! 🙂。

  3. Paystackペイメントゲートウェイを追加してください。私の国ではPayPalとStripが動作しません。
    助けてください!

    1. こんにちは、サミュエル・チャック、

      現時点では、StripeとPaypal Standardのみをサポートしており、この2つの決済プロバイダーに集中する予定です。ご指摘をメモしておき、今後のロードマップを計画する際に検討させていただきます。ご指摘に感謝いたします!

    2. Paystackを使用して、顧客がVipでコンテンツを閲覧する前にログインする必要がある購読料を集めたい。

      1. サミュエル - 現在、この統合オプションは用意していません。しかし、将来的に検討するために、機能リクエストリストに記載しました🙂。

    1. Varmaさん、こんにちは!
      現在、WPFormsはPayPalまたはStripeのみと統合することができます。
      混乱させて申し訳ありません!

  4. こんにちは、ダンです。
    wfプラグインを使って、電気料金や交通料金の支払いシステムをデザインできますか?CMSユーザーとしては初心者です。

    1. こんにちは、ダニエル!WPFormsで簡単な支払いフォームを作成することができます。私たちのウェブサイトにこのことについての素晴らしい記事があります。お役に立てれば幸いです!
      良い一日をお過ごしください。

  5. 私の知る限り、これは実際にはStripeでは動作しません。私はWPForms Proユーザーで、この設定を試してみましたが、合計値が$0のフォームを送信しようとすると、Stripから "invalid amount "というエラーが表示されます。

    1. こんにちは。
      フォームビルダーのPayments > Stripe settingsにあるConditional logicを使用すればうまくいくはずです。
      例えば、価格が "0 "のアイテムが選択された場合、またはチェックボックス、複数選択、ドロップダウンなどのフィールドの選択に基づいて、Stripeの支払いが処理されないように設定することができます。こうすることで、支払い条件が満たされていない場合、フォームでStripe支払いを無効にすることができます。
      お役に立てれば幸いです。
      それでは良い1日をお過ごしください。

      1. その通りだ。それはうまくいく。しかし、それはこのチュートリアルには全く欠けているプロセスのかなり重要なステップです!そのステップがなければ、うまくいきません。チュートリアルでは、支払いフォームを表示するために条件ロジックを使用することに言及していますが、支払いタブの追加ステップの必要性については言及していません。これを行う必要があるというのは直感的ではありません。私の知る限り、フォームにクレジットカードを入力する方法がないのであれば、なぜ支払いを処理しようとするのでしょうか?

      2. こんにちは、ダニエル、
        お時間を割いていただき、ありがとうございます。この件は投稿者に転送させていただきます。
        また、ご質問の件ですが、条件付きで無効化されていない場合、システムは支払いが処理されるべきであると判断します。
        ご迷惑をおかけして申し訳ありません!
        良い一日をお過ごしください🙂。

  6. 終身会員と年会員をストライプで固定したいのですが、設定方法を教えてください。

    1. こんにちは!
      Stripeアドオンのインストールと使用方法については、チュートリアルをご覧ください。
      ただし、WPFormsの機能以外を修正したい場合は、Stripeのサポートチームに直接お問い合わせいただくことをお勧めします。
      お役に立てれば幸いです。
      それでは良い1日をお過ごしください。

  7. いいえ、寄付したくありません」という選択肢の場合でも、Stripeでの支払いは可能ですか?つまり、私のフォームには4つの選択肢があります(Tier 1、Tier 2、Tier 3(すべて有料)、Tier 4(無料))。最後の選択肢を除くすべての選択肢で、Stripeでの支払いを必須にしたいのです。ユーザーがTier 4を選択した場合、支払いフィールドを非表示にするように条件付きで設定しましたが、Stripeの支払いがまだ必要なため、フォームが処理されません(コストは0ドルです)。何が間違っているのか教えてください。ありがとうございました!

    1. シャノンさん、こんにちは!
      WPFormsのライセンスをお持ちの場合は、メールサポートにアクセスできますので、サポートチケットを送信してください。
      それ以外の場合は、WPForms Lite WordPress.orgのサポートフォーラムで限定的な無料サポートを提供しています。
      お役に立てれば幸いです。
      それでは良い一日をお過ごしください。

  8. 顧客が名前、請求書番号、支払額を入力する「支払い」ページを設けたいと考えています。各支払額は異なるため、この「ユーザー定義」オプションは完璧に機能します。ありがとうございます。

    1. やあ、スティーブ - ユーザー定義オプションがあなたの要件を達成するのに役立ったとのことで、とてもうれしいです!

      良い一日を🙂。

    1. こんにちは、Wajid - これは実際に使用しているサービスプロバイダに依存します。WPFormsはカードデータを統合決済サービスプロバイダ(Stripe、Authorize.Netなど)に送信するだけで、そのような国特有の規制はすべてプロバイダ側で処理してくれます。一般的に、インドではデビットカードでの定期的な支払いはできませんが、これについての確認を取るには、統合プロバイダのサポートチームに連絡することをお勧めします。

      参考になれば幸いだ!

    1. セザール - ご連絡ありがとうございます!これはすでに機能リクエストリストにあります。開発チームが将来的に検討できるように、機能リクエストにあなたの投票を追加しました。

      ありがとう🙂。

  9. Paystackゲートウェイを追加。アフリカの人々はSTRIPEやPAYPALよりもPaystackに慣れています。Paystackを追加することで、あなたのフォームソリューションはアフリカフレンドリーになります。
    アフリカのWPFORMSにはPaystackが必要です。

    1. 現在、Paystackとの統合オプションは用意しておらず、現在の支払いオプション(StripePayPalAuthorize.net)に集中しています。しかし、今後の検討のため、機能リクエストリストに記載しておきました。

      ありがとうございます。

    1. こんにちは!現在WPFormsに含まれていない通貨(インドルピーなど)を追加したい場合は、こちらのDeveloper's Docを参考にカスタム通貨を追加してください。

      参考になれば幸いだ!

      さらにサポートが必要な場合は、有効なWPFormsライセンスをお持ちの場合はサポートチケットを送信してください。
      有効なライセンスをお持ちでない場合は、WPForms Lite WordPress.orgのサポートフォーラムで限定的な無料サポートを提供しています。

  10. いつWoocommerceをPaymentsに追加するのですか?そのプラグインが使えれば非常に助かります。払い戻しや支払いがもっと簡単になります。

    1. こんにちは、ジェイミー。WooCommerceは支払い処理業者ではないので、私たちが追加できる支払いオプションではありません。WooCommerceのプラットフォームはWPFormsが決済処理を統合するのと同様にサードパーティのプロセッサを統合します。また、WooCommerceとの統合はサポートしていません。WooCommerceは独自のフォームシステムと大きく統合されているからです。

      この件に関してさらにご質問がある場合は、有効なサブスクリプションをお持ちであれば、私たちにご連絡ください。そうでない場合は、遠慮なくサポートフォーラムに質問をお寄せください。

  11. こんにちは、WPformsはpaypalのゲストチェックアウトを許可していますか?

    1. hanamichyさん、こんにちは!弊社のPayPalインテグレーションは、フォームをPayPal(すべての処理を行う)に接続するだけですので、PayPalアカウントの設定に依存します。そのため、PayPalアカウントの設定に依存することになります。PayPalの詳細については、こちらのPayPalガイドを参照してください。

      この件に関してさらにご質問がある場合は、有効なサブスクリプションをお持ちであれば、私たちにご連絡ください。そうでない場合は、遠慮なくサポートフォーラムに質問をお寄せください。

      1. ヘンリーさん、PayPalの情報を見ました。私はWPFormsを使っているので、これらのいずれかが適用されますか?

        以下の製品では、ゲストのチェックアウト体験は提供されません:
        - CreateBillingAgreement, CreateRecurringPaymentsProfile, Express Checkout using Billing Agreements or Recurring Payments.APIログでこれらの参照を見つけることができます。システムがこれらのAPI操作を使用しているかどうか不明な場合は、開発者またはカートプロバイダーに連絡してログを確認してください。

        - PayPalのHTML分割払い、定期購入、自動請求ボタン。これらの商品でゲストチェックアウトを行うには、強化された定期的な支払い商品
        製品が必要です。

        - REST課金契約

        - PayPalのHTML寄付ボタンは、チェックアウトが定期的な支払いである場合。

        ご協力ありがとう。

      2. PayPalのダッシュボードでゲストチェックアウトを有効にした後、ゲストチェックアウトは機能するはずです。

        ご不明な点がございましたら、有効なサブスクリプションをお持ちの場合はサポートチケットを送信していただくか、有効なサブスクリプションをお持ちでない場合はサポートフォーラムにご投稿ください。

        WordPressの規定により、コメントでのサポートは行っておりません。ご了承ください。

  12. ユーザーが年会費の更新を提出する手段として、wpformsの使用を検討しています。 wpformsは会員IDのようなカスタムフィールドを提供することは理解しています。 会員IDを含む報告メカニズムまたはトランザクションリストはありますか? 支払いの照合に非常に有益だと思います。

    1. Stevenさん、こんにちは!弊社のフォームビルダーでは完全なカスタムフォームを作成することができますので、会員IDを収集するフィールドを含めることは間違いなく可能です。トランザクションリスト」のような特別な機能はございませんが、すべての有料版では、送信されたすべてのデータをフォームに記録することができます。また、エントリー管理システムにはフィルタリング機能があり、会員IDで結果を絞り込むことができます。

      WordPressの管理エリア内ですべてのエントリーを確認することができます。以下はメインのエントリーページのスクリーンショットで、個別のエントリーページのスクリーンショットです。

      エントリーをCSVファイルにエクスポートすることもできます。その方法については、こちらのチュートリアルをご覧ください。CSVファイルは、Excelのようなスプレッドシートプログラムで開くことができます。

      WPFormsのエントリー管理機能の詳細については、こちらのガイドをご覧ください。

      この件に関してさらにご質問がある場合は、お問い合わせください!

  13. Paystackとの統合をもっと早く追加してほしい。アフリカではPaystackの方が好まれている。早く追加してほしいです。

    1. Paystackのアドオンは素晴らしいと思います。しかし、今のところPaystackのアドオンはありません。ロードマップを計画し続ける中で、将来的に検討するためにメモを取り、機能リストに入れました。

      Zapierというコネクターサービスには、これに接続する機能があるようですね。もしその方法を検討したいのであれば、今すぐサービスに接続できる可能性があります。Zapierアドオンは、Proライセンスレベル以上でご利用いただけます。

      Zapierアドオンのセットアップに関するチュートリアルはこちら。

      この統合に関するZapierのページはこちら。

      お役に立てれば幸いです! 🙂。

  14. 文字列のURLに基づいて、支払総額を追加することは可能ですか(URLから合計フィールドに数字を取得する)?よろしくお願いします。

    1. こんにちは、エミ!

      申し訳ございません。ご要望を完全に理解したわけではありません。URLから提供された値をフォーム自体に含めずに合計フィールドに追加させたいのでしょうか?もしそうであれば、申し訳ありませんが、合計フィールドはフォーム自体の支払いフィールドの値のみを合計することができます。

      この件に関してさらにご質問がある場合は、有効なサブスクリプションをお持ちであれば、私たちにご連絡ください。そうでない場合は、遠慮なくサポートフォーラムに質問をお寄せください。

      ありがとう!

      1. こんにちは、ヘンリー、
        これらのフィールド(支払い)のどれかで、urlから金額を取得できるのでしょうか?

      2. こんにちは、エミ、

        URLというのは、クエリー文字列のことを指しているようですね。もしそうであれば、クエリ文字列URLを使ってフォームのPaymentフィールドに金額を入力することは可能です。ただし、Paymentフィールドは Single Itemフィールドでなければならず、Item Typeは User Definedに設定されていなければなりません。

        ユーザー定義支払いフィールドの設定については、こちらの記事を参照してください。

        クエリー文字列URLで事前入力できるようにフォームを設定する方法の詳細は、こちらのガイドを参照してください。

        この件に関してさらにご質問がある場合は、有効なサブスクリプションをお持ちであれば、私たちにご連絡ください。そうでない場合は、遠慮なくサポートフォーラムに質問をお寄せください。

  15. こんにちは、

    顧客に小切手またはクレジットカードによる支払いを選択できるようにするため、条件付きロジックを作成する必要がある(小切手を選択した場合→クレジットカードによる支払いを非表示にし、クレジットカードを選択した場合→記入する小切手の文言を非表示にする)。

    顧客が小切手を選択した場合、銀行データを入力することによってのみフォームを検証することができる。

    この場合、どうすればいいのでしょうか?
    よろしくお願いします。

    1. こんにちは、フィル-あなたが直面している奇妙な問題についてお聞きして申し訳ありません!

      可能な限りお客様のご質問にお答えするために、お客様が直面している問題の詳細について、弊社チームまでご連絡いただけますでしょうか。

      ありがとう! ᙂ。

  16. サー/マダム

    WPFormsのRazorPay統合に取り組んでください。インドで人気が出てきています。早急に開発チームにお知らせください。Anurodhの提案に同意します。

    ありがとう

    1. こんにちは、アクリ、

      ご提案ありがとうございます!あなたの投票を既存の機能リクエストに追加しました。貴重なアイデアをお寄せいただき、ありがとうございました!

      ありがとう!

    1. 現在、Digiペイメントとの統合は行っていません。しかし、それは非常に便利だと思います。機能要望をメモしておきましたので、今後のロードマップを計画する際に注目しておきます。

      ありがとう!

コメントを追加する

コメントをお寄せいただきありがとうございます。すべてのコメントはプライバシーポリシーに従って管理され、すべてのリンクはnofollowであることにご留意ください。名前欄にはキーワードを使用しないでください。個人的で有意義な会話をしましょう。

このフォームはCloudflare Turnstileによって保護されており、Cloudflareプライバシーポリシーおよび利用規約が適用されます。