AI要約
WordPressフォームで支払いを受け付けたいですか? Stripe Pro アドオンを使用すると、ユーザーはサイトから離れることなく、1回限りの支払い、または定期的なサブスクリプション支払いさえも簡単に送信できます。
このチュートリアルでは、WPForms で Stripe Pro アドオンをインストールして設定する方法を説明します。
要件:
- Stripe Pro アドオンにアクセスするには、Pro ライセンスレベル以上が必要です
- Stripe Pro アドオンの最小必要バージョンを満たすために、WPForms の最新バージョンがインストールされていることを確認してください
- Stripe では、ライブ決済フォームを追加するページで SSL (HTTPS) が有効になっている必要があります。これにより、クレジットカードデータを安全に Stripe に送信できます。設定の詳細については、WPBeginner のWordPress で SSL と HTTPS を追加する方法をご覧ください。
- オンライン決済の規制は国によって大きく異なる場合があります。お使いの決済フォームが地域の法律に準拠していることを確認するために、Stripe の国別要件を確認してください。
開始する前に、WordPress サイトに WPForms をインストールし、ライセンスを認証してください。次に、Stripe Pro アドオンをインストールして有効化してください。
注意: Stripe の処理手数料は、成功したカードチャージごとに 2.9% + 30 セントから始まります。これはStripe の料金ページに記載されています。WPForms ライセンスが無効な場合、WPForms によって各トランザクションに追加で 3% の処理手数料が適用されます。
Stripe をサイトに接続する
Stripe Pro アドオンの準備ができたら、WordPress サイトの左側メニューにある WPForms » 設定を開く必要があります。そこから、支払いタブをクリックします。

サイトで使用する通貨を調整したい場合は、続行する前に 通貨ドロップダウンから必要なオプションを選択してください。

準備ができたら、Stripe セクションまでスクロールします。ここで、青い Stripe に接続ボタンをクリックします。

注意: テストモードとライブモードは個別に接続する必要があります。現在テストモードを使用している場合は、フォームを公開する準備ができていることを確認するために、テストモードオプションをオフにして、この接続プロセスを繰り返してください。
次に、フォームと Stripe の間の接続を承認するように求められます。このページに表示される正確な内容は、Stripe アカウントが既にアクティブになっているかどうかによって異なります。

Stripe Connect ウィザードのすべての手順を完了すると、サイトの管理画面にリダイレクトされます。ここで、接続ステータスの横に緑色のチェックマークが表示されるはずです。

Stripe Webhook の設定
Stripeは、Stripeアカウントで発生したイベントを外部ソースと同期するために、Webフックを使用します。
WPFormsでStripe Webhookを設定すると、WordPress管理画面で支払いフォームからのリアルタイム更新を表示できます。
WPFormsの「支払い概要」ページから、サブスクリプションを管理したり、返金を処理したりできます。

Stripeアカウントを接続すると、WPFormsバージョン1.8.4以降ではWebhookが自動的に設定されます。ただし、場合によっては、自動設定がアカウントで機能しないことがあります。
その場合は、アカウントに手動で設定できます。詳細については、Stripe Webhookの設定に関するガイドを参照してください。
クレジットカードフィールドモードの選択
StripeをWordPressサイトに接続したら、クレジットカードフィールドモードセクションまでスクロールします。
クレジットカードフィールドモードの2つのオプションから選択できます。
- カード要素
- 支払い要素

各フィールドモードの詳細については、以下で説明します。
注意: WPFormsバージョン1.8.2以降をインストールしたばかりの場合、クレジットカードフィールドモードオプションは表示されません。WPFormsバージョン1.8.2に更新する前に支払い要素オプションを選択した場合も、オプションは表示されません。
カード要素
カード要素オプションを使用すると、カード番号、郵便番号、有効期限を検証するための事前構築済みコンポーネントを使用して、カード情報を簡単に収集できます。このオプションを使用すると、フォームが簡素化され、必須フィールドの数が最小限に抑えられます。

支払い要素
支払い要素オプションを使用すると、単一の統合を通じて複数の支払い方法を受け入れることができます。また、支払い方法と国に基づいて必要な情報を収集するために、入力フィールドが自動的に調整され、チェックアウトプロセスが簡素化されます。

Stripeが特定のデバイスとブラウザで検出した支払いオプションのみが表示されます。
注意: ユーザーがこれらの支払いオプションの使用に関するStripeの要件を満たしている場合にのみ、Google PayおよびApple Payでの支払いオプションが表示されます。要件の詳細については、 Stripeのドキュメントを参照してください。
リンクでチェックアウト
支払い要素モードを使用することを選択した場合、チェックアウト中にすべてのカード情報を入力する必要はありません。Linkでは、メールアドレスでカード情報を保存するオプションが提供されます。
これにより、メールアドレスを入力すると、すべてのカード情報が自動的に入力されます。
設定は簡単です!初めて使用するときは、チェックアウト時にメールアドレスフィールドにメールアドレスを入力するだけです。

その後、情報を保存するための新しいオプションが表示されます。
カード情報を入力したら、Link を使用した安全な1クリックチェックアウトのために情報を保存するというラベルの付いたボックスをチェックします。

次に、電話番号と名前を入力し、フォームを送信します。

次回のチェックアウト時には、フォームのメールアドレス欄にメールアドレスを入力するだけです。その後、携帯電話で受信した確認コードを入力すると、カード情報が自動入力されます。

Linkでチェックアウトする際、別のメールアドレス欄からユーザー情報を自動入力するか、既に入力済みのメールアドレス欄から取得するかを選択できます。
これらの設定を変更するには、Stripeクレジットカードフィールドをクリックし、詳細設定タブに移動します。次に、 Linkメールアドレスドロップダウンをクリックして、適切なオプションを選択します。

フォームに Stripe を追加する
クレジットカードフィールドモードを選択したら、フォームでStripe決済を有効にし始めることができます。
まず、新しいフォームを作成するか、編集のために既存のフォームを開く必要があります。フォームは自由にカスタマイズできますが、Stripeで機能させるためには、次のものを含める必要があります。
- メールアドレスフィールド
- 支払い項目フィールド(単一項目、複数項目、チェックボックス項目、またはドロップダウン項目)
- Stripeクレジットカードフィールド
例として、名前、メールアドレス、ドロップダウン項目、合計、およびStripeクレジットカードフィールドを含む簡単な注文フォームを作成します。

注:Stripeを機能させるために合計フィールドは必須ではありません。しかし、ユーザーが選択した項目とその数量の注文概要を表形式で簡単に確認できると、多くの場合役立ちます。これにより、ユーザーは請求される正確な金額を確認できます。詳細については、合計フィールドの使用ガイドをご覧ください。
フォームビルダーに含めたいフィールドを追加したら、支払い » Stripeに移動する必要があります。右側のパネルで、1回限りの支払いを有効にするオプションをオンに切り替えます。

注:Stripe Proアドオンが正しく機能するためには、続行する前にAJAXフォーム送信を有効にすることも忘れないでください。
このフォームでStripe決済を有効にしたら、短い支払い説明を入力します。このテキストは、ユーザーがあなたのサイトで行われた支払いを識別するのに役立つように、ユーザーのクレジットカード明細書に表示されます。

次に、Stripe支払い領収書の下で、フォームからメールアドレスフィールドを選択します。これにより、Stripeはユーザーに支払い領収書を送信できます。

最後に、顧客メールアドレスの下で、顧客のメールアドレスが含まれているフォームからメールアドレスフィールドを選択します。

顧客名、顧客の電話番号、顧客住所、配送先住所など、追加の顧客詳細をマッピングするオプションも表示されます。これらの詳細は、Stripeダッシュボードの対応するセクションに表示されます。
カスタムメタデータを Stripe に送信する
カスタムメタセクションでは、フォームからStripeに追加データをメタデータとして渡すことができます。
各行には以下が含まれます:
- オブジェクトタイプ:データをStripeの支払いまたは顧客オブジェクトに送信するかどうかを選択します
- メタキー:Stripeでメタデータキーとして表示されるカスタムラベルを入力します
- メタ値:送信する値を選択する、サポートされているフォームフィールドを選択します
複数のカスタムメタ行を含めることができます。すべての値は、Stripeダッシュボードのメタデータセクションに表示されます。

注意:Stripeの支払い用にカスタムメタデータを追加する場合、フォームを保存する前に各行が完了していることを確認してください。
メタキーフィールドは、オブジェクトタイプとメタ値の両方のフィールドが選択されている場合にのみ必須になります。
他のフィールドが入力されている間にメタキーを空のままにすると、WPFormsは不足しているフィールドを完了するように求めるアラートを表示します。
フォームを使用して1回限りの支払いを受け取る場合は、フォームを保存して次のステップに進むことができます。サブスクリプションなどの定期的な支払いには、さらにいくつかの設定を入力する必要があります。
注意:フォームにStripeを設定した後、WordPressダッシュボードから直接これらのトランザクションを監視および管理できます。詳細については、Stripeの支払い表示と管理ガイドを確認してください。
定期購読支払いの有効化
ユーザーに定期的に請求したい場合は、支払いフォームでサブスクリプションを有効にすることができます。
定期支払いセクションで、定期購読支払いを有効にするオプションをオンに切り替えます。

このオプションを有効にすると、このセクションの他のフィールドを完了する必要があります。これには以下が含まれます:
- プラン名:サブスクリプションのタイトルを入力します。これは、Stripeアカウントのこのフォームのトランザクションに表示されます。
- 定期期間:定期的な支払いをどのくらいの頻度で行うかを選択します。オプションは、毎日、毎週、毎月、四半期ごと、半年ごと、または毎年です。
- 定期サイクル:支払いを繰り返したい回数を決定します。Stripeは最大100回の繰り返し、または最長20年の期間をサポートします(いずれか早い方)。たとえば、四半期ごとの最大値は80、半年ごとの最大値は40、年間の最大値は20、その他の期間の最大値は100です。
- 顧客メール:顧客に連絡できるように、フォームからメールフィールドを選択します。これは、Stripeで顧客のサブスクリプションを作成するために必要です。
顧客名、顧客の電話番号、顧客住所、およびカスタムメタフィールドを含む、追加の顧客情報のマッピングオプションも表示されます。
注意: Stripeダッシュボードでサブスクリプションを管理したい場合は、請求 » サブスクリプションメニューから行う必要があります。現在、Stripeダッシュボードの支払いメニューからトランザクションを表示している場合、プラン名は表示されません。
追加のサブスクリプションプランを作成したい場合は、新規プランを追加ボタンをクリックしてください。

表示されるオーバーレイで、プランの名前を入力し、続行するにはOKをクリックしてください。

注意: 複数の定期支払いを同時に処理できないという警告が表示されます。条件付きロジックルールが複数のプランに一致する場合、条件に最初に一致したプランが処理されます。
その後、作成した新しいプランまでスクロールし、最初のプランと同様にオプションを設定します。

注意: 支払いフォームに必要なだけサブスクリプションプランを追加できます。
作成した追加プランを削除したい場合は、プラン名の横にあるゴミ箱アイコンをクリックしてください。

支払い設定の構成が完了したら、必ずフォームを保存して設定を更新してください。支払いフォームを公開する前に、Stripeでの支払いテストをお勧めします。
注意: 支払いフォームをさらにカスタマイズし、ユーザーにさらに柔軟性を提供するには、Stripeでの支払いと条件付きロジックの使用方法を検討してください。
よくある質問
これらは、Stripe Proアドオンの使用に関してよく受ける質問の一部です。
WPFormsをしばらく使用していますが、このチュートリアルはサイトで表示されるものと異なりますか?
Stripe連携をさらに安全にし、SCA(Strong Customer Authentication)に準拠するように更新しました。
これらの新しいオプションを表示するには、次の2つの手順を完了する必要があります。
- サイトがWPFormsの最新バージョンに更新されていることを確認してください。
- 次に、このガイドのStripeをサイトに接続するセクションの手順に従ってください。
Stripeに接続ボタンが機能しないのはなぜですか?
Stripeでは、Stripe Connectを使用してアカウントを接続できるのはオーナーまたは管理者のみです。プロセスを完了できないように見える場合は、Stripeのユーザーロールを確認して、これらの要件を満たしていることを確認してください。
WPFormsからStripeアカウントを切断するにはどうすればよいですか?
Stripeアカウントを切断したい場合は、WPForms » 設定 » 支払いに移動し、Stripeセクションまでスクロールしてください。ここで、アカウントを切断するオプションが表示されます。

これにより、サイトとStripe間の接続が削除されます。必要に応じて、後でStripeに接続ボタンを再度クリックすることで再接続できます。
サイト内で別のStripeアカウントに切り替えるにはどうすればよいですか?
サイトで使用するStripeアカウントを別のものに切り替えたい場合は、WPForms » 設定 » 支払いに移動し、Stripeセクションまでスクロールしてください。
そこから、アカウントを切り替えるボタンをクリックして、サイトが使用しているStripeアカウントを変更します。

フォームでStripeの支払い方法をテストするにはどうすればよいですか?
フォームをテストする最善の方法は、エントリーを送信し、ユーザーと同じ手順に従うことです。実際の支払いを受け付ける前にトランザクションをテストできるため、フォームをライブページに追加する前にStripeのテストモードを設定することをお勧めします。
WPFormsは支払いデータを保存しますか?
WPFormsは、クレジットカードの下4桁のみを保存します。これは、各エントリーに使用された支払い方法を識別するために使用されます。
実際、当社のフォームはお客様のサイトに機密性の高いクレジットカードデータを保存しません。代わりに、当社のStripe連携により、機密情報はサーバーに触れることなく、安全かつ直接Stripeに通信されます。これにより、お客様とユーザーの両方が、クレジットカードの詳細を保存することに伴う潜在的なリスクから保護されます。
フォームでStripeを使用するために料金はかかりますか?
ライセンスが有効な場合、WPFormsはフォームでStripeを使用するための料金を請求しません。ただし、WPFormsライセンスが無効な場合、各支払いに対して3%の処理手数料が適用されます。Stripeの料金ページに記載されているように、この手数料は、Stripe独自の処理手数料(成功したカードチャージごとに2.9% + 30セントから始まる)とは別です。
フォームのStripe要素の外観をカスタマイズする方法はありますか?
もちろんです!Stripe要素を、フォームの外観に合わせてスタイル設定する柔軟性があります。
Stripeクレジットカードフィールドのプレースホルダーのスタイルを変更するには、Stripeクレジットカードプレースホルダーのスタイリングを変更するに関する開発者ガイドを参照してください。
色、フォントなど、より広範なカスタマイズオプションについては、Stripeのスタイリングをカスタマイズするに関する開発者ドキュメントをご覧ください。
Stripe Linkとは何ですか?また、WPFormsの支払いプロセスから削除するにはどうすればよいですか?
Stripe LinkはStripeの機能で、顧客の支払い情報と配送情報を自動的に保存および入力し、チェックアウトプロセスを簡素化します。この機能は、WPFormsで支払い要素オプションを選択すると自動的に有効になります。ただし、この機能を無効にして、顧客にトランザクションごとに詳細を手動で入力させる必要がある場合は、Stripeダッシュボードの設定を通じて行うことができます。
特定のセットアップでStripe Linkをオフにする方法の詳細については、StripeのLinkを無効にするに関するStripeドキュメントを参照してください。
どのようなフォームフィールドをカスタムメタデータとしてStripeに送信できますか?
メタ値ドロップダウンを使用して、特定のサポートされているフォームフィールドの値をStripeに送信できます。これは、トランザクションと一緒に紹介コードやユーザーIDなどの追加情報を保存したい場合に便利です。
例えば、フォームに「紹介コード」というラベルのSingle Line Textフィールドがある場合、その値をreferral_codeというメタキーでStripeに渡すことができます。

サポートされているフィールドタイプは次のとおりです。
- 一行テキスト
- 段落テキスト
- チェックボックス
- ラジオ
- ドロップダウン
- 数値
- 評価
- 数値スライダー
- 支払いフィールド(単一商品、複数商品、ドロップダウン商品、チェックボックス商品、合計)
これで完了です!WPForms Stripe Proアドオンを使用すると、フォームで1回限りの支払いとサブスクリプション支払いを設定できるようになりました。
次に、Stripeトランザクションを追跡することに興味がありますか?Stripeの支払いを表示および管理するチュートリアルを確認して、方法を学んでください。