Note: Make sure your website meets Stripe security standards before use
Stripe has specific HTTPS and TLS security standards that your website must meet to be able to use their service to collect payments. If your website does not meet these security standards, you will not be able to communicate payment information to the Stripe service. Please see their documentation for details. If you have questions about your WordPress website meeting these standards, please contact your hosting provider.
Connecting Ninja Forms to Stripe
The first step to using Stripe with Ninja Forms is getting your API credentials. This will allow your forms to communicate with Stripe and is a required first step before payments can be collected.
You can find your API credentials in your Stripe dashboard.
Enter these keys into your dashboard under Ninja Forms > Settings > Stripe. Be sure to Save Settings after.
Setting Up a Form to Collect Payments
Before setting up your form, be certain that you have set up your API credentials as described in the section above.
First, open your payment form and click on the Emails and Actions tab at the top of the form builder.
Next, click the blue circle/+ icon in the bottom right of the screen to open the list of available actions.
Choose either the Collect Payment or Stripe action from the list of available actions. They’re functionally identical, so selecting either is fine.
With the action added to your form, click to open it. If you selected the Collect Payment action, you’ll need to set the PAYMENT GATEWAYS setting to Stripe. If you selected the Stripe action, this is already set for you.
You now need to set the total that will be sent to Stripe in the GET TOTAL FROM setting. This can be one of three options:
- A Fixed Amount
- A Calculation
- A Field
What each of those mean and how their configuration options are covered in the sections below.
In the Customer Email Address setting, a merge tag for the email field of your form can be entered to pass into Stripe associated with this charge. This can be used within Stripe to send a receipt.
Charging a Fixed Amount
If the total sent to Stripe is a static amount that will never be different from purchase to purchase, select the Fixed Amount Option. Simply enter the amount you wish to charge in the ENTER AMOUNT setting.
When the form is submitted, users will be prompted to pay this fixed amount via Stripe.
Using a Calculation to generate a total
If you are charging variable amounts per purchase via a Ninja Forms calculation, that total can be sent to Stripe directly as the amount the user will be charged.
Simply select Calculation from the GET TOTAL FROM setting, and then select the calculation itself in the SELECT CALCULATION dropdown.
When the form is submitted, users will be prompted to pay the calculation’s value via Stripe.
Using a form field as the total sent to Stripe
If your purchase total is contained within a field such as a Number field, you can have the value of that field sent directly to Stripe.
Simply select the Field option from the GET TOTAL FROM setting, and then select the field that houses your total from the SELECT FIELD dropdown.
When the form is submitted, users will be prompted to pay the field’s value via Stripe.
Accepting recurring payments
The Stripe add-on has the option to connect to your Stripe recurring payment plan. You will need to have a recurring payment plan configured in your Stripe account to use this feature.
Under the Advanced setting of the Stripe action, enter the Recurring Payment Plan ID from your Stripe account:
All payments accepted via this action will now be routed to that plan.
Sending additional details to Stripe with the charge
If you want to include a description of the product(s) into Stripe or other details when the charge is processed, that option can be found under the Advanced settings of the Stripe action.
You can send an image to Stripe for the product purchased by filling out the Product Image URL field. Note: This URL must be a valid URL for the image you want to use.
Additional metadata can also be sent to Stripe by setting up key value pairs in the section provided under the Advanced Settings of the Stripe Action.
To find out more information about Stripe Metadata, you will need to reference the Stripe API documentation.
Enabling Testing Mode
To enable testing for your form, toggle on (green) the Test Mode setting. This setting is found under the Advanced settings of the Stripe action.
With the appropriate Test API credentials entered as described in the Connecting Ninja Forms to Stripe section above, submitting the form in this mode will allow you to test the form with Stripe. This must be toggled off to accept live payments.
Stripe also provides a list of test credit cards that you can use while testing:
Test Card Example:
Processing of the Stripe Payment on Form Submission
As of version 3.1 of the Stripe add-on, the plugin has been updated to meet the Strong Customer Authentication (SCA) rules required for payments from EU users. This is done through the Stripe add-on by using Stripe’s 3D Secure Card Payment
When a user makes a submission on the form that has a Stripe Collect Payment Action activated on it, the user will be forwarded to Stripe’s site (https://checkout.stripe.com) to make a secure payment.
Once the payment is made, the user will be sent back to your site to complete the payment token in Ninja Forms. The rest of the form actions will then process.