Do you want your visitors to be able to choose to donate to your nonprofit as they’re filling out a form? Using conditional logic, you can hide fields unless the user chooses a certain option.
So in this article, we’ll walk you through how to add optional payment to your WordPress form. If you’d like to watch our video tutorial, click on the play button below.
If you’d prefer written instructions, keep reading.
In This Article
Step 1: Adding Form Fields
The first thing you need to do is install and activate the WPForms plugin. Here’s a step-by-step guide on how to install a WordPress plugin.
Also, you’ll need to have a form created. See our tutorial on How to Create a Simple Contact Form for an example to get started. You can use any kind of form, but for this tutorial, we’ll be using a contact form.
The default contact form comes with Name, Email, and Comment or Message fields. We need to also add the Multiple Choice and Single Item fields to the form.
Just drag and drop fields into the right-hand panel in the form builder to add them.
You’ll need one of the credit card fields as well. WPForms works seamlessly as a WordPress Stripe plugin if you need to give a Stripe payment option to your users.
In fact, WPForms also integrates with PayPal, Authorize.Net, or Square for accepting payments. You can even set up your form to allow users to choose a payment method.
After you add all the fields you need, you can start customizing them.
If you want to enable Apple Pay, see our guide on taking Apple Pay payments on a form.
Step 2: Customizing Form Fields
The Multiple Choice field comes with three choices, but you only need two choices for optional payment. You can simply remove the third choice by clicking on the field in the right panel and then deleting the third choice in the left panel.
Since you’re going to be asking your visitors if they would like to donate, it’ll be a good idea to change the labels for the Multiple Choice field in the options panel, too.
We’ll set the label to Would you like to donate? and the choices to Yes, I’d like to donate and No, thanks.
The Single Item field needs to be set to User Defined so users can enter their own donation amount.
If you need help customizing the donation amounts, you can read this article on how to create a donation form with multiple amounts.
Step 3: Enabling Conditional Logic
To add optional payment to your form, you first need to enable conditional logic on the credit card field.
You can enable it by clicking the field, then selecting the Smart Logic tab. From there, click the Enable Conditional Logic option.
Next, you’ll want to set up the logic so that it says Show this field if Would you like to donate? is Yes, I’d like to donate.
So if someone doesn’t want to donate, the credit card field won’t show up.
Now we need to tell our payment integration not to try to process the payment if the visitor doesn’t want to donate. We’ll be using Stripe in our example, but the process is pretty much the same if you use PayPal, Square, or Authorize.Net.
Note: While Stripe payments are available in all versions of WPForms and don’t require the addon, you’ll need the Stripe Pro addon (available in Pro and above) to access conditional logic settings for the Stripe payment field.
First, click the Payments icon on the left of the form builder. Then click the option for your payment processor.
We’ll assume you’ve already enabled payments and configured your settings. Next, go ahead and turn on the Enable conditional logic setting in the right-hand pane. Underneath, create a rule that says Don’t process if the user selects No, thanks.
Now, even if the user types a value into the donation field, the form won’t charge their card if they’ve selected No, thanks.
After you’re done configuring the order form settings, click Save to store your changes and your form is ready to be published on your site.
Once you start collecting entries, you can find submissions by going to WPForms » Entries and searching for keywords or for a donor’s payment details, such as their receipt number.
That’s it! You’ve just added an optional payment to your WordPress form.
If you need more help creating a nonprofit donation form for your site, then we have a separate guide exactly for that!
Next, Start Processing Online Orders Faster
Want to accept payment for the online orders? Check out how to process payments with your WordPress order forms.
If you’re looking to save even more time processing online orders, you can check out our tutorial on how to create a client booking form that connects with your calendar software.
What are you waiting for? Get started with the most powerful WordPress forms plugin today.
If you like this article, then please follow us on Facebook and Twitter for more free WordPress tutorials.