Creating a donation form for my nonprofit website seemed straightforward at first. I thought I could just add a PayPal button and call it a day. But I quickly learned that wasn’t enough when donors started asking for tax receipts, and my team needed better ways to track contributions.
That’s when I went about looking for WordPress plugins and found Charitable and WPForms. This transformed how we handle online donations. Now, instead of cobbling together different payment tools and manually sending receipts, everything happens automatically through a professional-looking donation form.
In this tutorial, I’m sharing 2 methods I’ve used on my own websites. I’ll show you how to set up Charitable and WPForms on your WordPress site to create secure donation forms.
By the end of this tutorial, you’ll have a professional donation system that makes it easy for supporters to contribute to your cause while keeping your administrative work to a minimum.
When donors visit your site, they’ll be able to make one-time or recurring donations, choose their preferred payment method, and automatically receive tax receipts. Plus, you’ll have a clear overview of all donations and donor information in your WordPress dashboard.
What You Need to Create a Donation Form
To create a stunning and functional donation form on your website, you need a tool. This is the easiest way to go about it, unless you’re willing to hire a developer or outsource the project to an agency.
With the tools available today, you can definitely set this up yourself. As I’ve mentioned, of all the tools out there, I love these two that make it so easy to set up a donation form and payment gateway on your site:
- Charitable: Create stunning fundraiser campaigns
- WPForms: Create a simple donation form
I’ll show you how to create your donation form using both plugins.
Creating a Donation Form with Charitable
Charitable stands out as our recommended solution for WordPress donation forms, particularly if you’re looking to build engaging fundraising campaigns rather than just basic donation forms.
Charitable approaches donations differently than standard form builders. Instead of just collecting payments, it creates a complete fundraising environment on your WordPress site. The plugin lets you build campaign-focused donation forms that drive better engagement and higher conversion rates.
This plugin integrates directly with your WordPress theme, ensuring your donation forms look native to your site. The forms are mobile-responsive and optimized for conversions, with features like suggested donation amounts and recurring giving options built right in.
While other solutions offer basic form functionality, I love Charitable because it also provides:
- Campaign progress tracking
- Donor management tools
- Automated tax receipts
- Real-time donation tracking
- Custom email notifications
This makes it particularly effective for organizations looking to build sustainable giving programs rather than just collecting one-time donations.
That said, let’s get started with the steps.
Step 1: Install and Activate Charitable
First, we need to install the Charitable plugin. You have two options to get started with Charitable: the free version from WordPress.org or the recommended Pro version with advanced features.
For the free (or lite) version, in your WordPress dashboard, go to Plugins » Add New. There’s a search box at the top-right corner, type in “Charitable”.
You’ll see the plugin populate. All you have to do is click the “Install Now” button and then the “Activate” button.
If you want to use Charitable Pro (the one I’ll be using for this tutorial), navigate to the Charitable website. Select your plan and sign up for an account.
When you sign up, you’ll get access to your own Charitable account. Here, you can download your plugin file and copy your license key in the Downloads tab.
Now, go to Plugins » Add New » Upload Plugin. Choose the plugin file from your computer and upload it.
Need more help with installing Charitable? Learn how to install a plugin here »
Once Charitable is activated on your WordPress website, you’ll see a welcome screen. You can run through the setup wizard by clicking the Let’s Get Started” button. I recommend doing this because it helps you set up all the necessary configurations.
For instance, you can choose your currency and set up your payment gateway.
Aside from the wizard, you need to go to Charitable » Settings page. For the pro version, you need to paste your license key here.
Now you’re ready to connect your payment gateway account.
Step 2: Enable Payment Options
In the Charitable » Settings tab, there is a Payment Gateway options.
Charitable comes with Stripe built-in to the plugin so it’s available for all to use no matter which version of the plugin you have. On the free plan, there’s 3% transaction fee. This goes away with the Pro plan.
Also, with the Pro plan, you’ll get access to more gateways, including PayPal, Square, Mollie, Payrexx, and PayFast. For the full list, head over to list of Charitable’s payment gateways »
Now here’s something I find amazing about Charitable. You can enable and disable gateways with just a click. That’s all it takes.
While you set up, I recommend first enabling Test Mode. You can test out donations without processing real payments while you’re setting everything up.
Here, you should see Stripe already enabled. If you want to use another gateway, simply enable it. Then use the ‘Gateway Settings’ button.
So for instance, if you click on the Stripe Gateway Settings button, you’ll be taken to the Stripe page. Here, you can add your Live Secret Key and Live Publishable Key to connect your Stripe account.
If you’re not sure where to get these keys, they’re usually available inside your payment gateway account. If you can’t find them, contact your payment gateway’s customer support to get it.
Step 3: Creating Your First Donation Campaign
Now you’re ready to create your donation form. Go to Charitable » Campaigns » Add New in your WordPress dashboard. You’ll see a library of templates to choose from, or you can start from scratch. You need to add a name for your campaign at the top.
When you click on a template, this will open up the campaign builder. You’ll see a preview on the right side that you can edit. So you can see how your campaign would appear on the front end as you build it.
On the left, there’s a menu with more form fields. You can drag and drop the fields you want into your campaign design. So for instance, you can add a progress bar, photos, organizer name, donate amount, social links, and more.
Your donation form will have an image that appears at the top of your campaign page and in campaign previews. You can change this to something that’s relevant to your cause.
Make sure to save your changes in the top right corner of the screen. When your design is ready, let’s configure your campaign settings.
Step 4: Configuring Campaign Settings
In the Settings tab in the far left menu, there are important settings you need to know about.
Under General Settings, you can set your campaign goal amount and add an end date for your campaign. Leave the date blank if you want to run it as an ongoing campaign till it reaches its goal. Here, you can also add tags and categories to keep your campaigns organized.
Below this, in the Donation Options tab, you can add suggested amounts for donations. There are also description fields for each amount (For example, “$50 – School supplies for 1 child”).
I recommend using these suggested amounts. I’ve found that it works well when you give donors suggested amounts along with an option to add a custom amount.
Now it’s time to publish your donation form.
Step 5: Publish Your Donation Campaign on Your Website
In the top-right corner of the campaign builder, you can save your design. You’ll also see options to preview and publish your campaign.
When you publish it, you’ll get an option to embed the campaign using the embed wizard.
Now you can use this embed wizard to either add the campaign to an existing page on your WordPress site. You can also choose to create a new page here and add the campaign there.
I also want to show you how to manually add your campaign to any page or post in your WordPress dashboard.
Let’s start by editing the page where you want to display the campaign. In your WordPress dashboard, go to the Pages tab and edit the one you want. Inside the block editor, click the plus (+) icon to add a new block.
Charitable has a readymade block. All you have to do is search for “Charitable” and add the Charitable Campaign block to your page.
A dropdown menu will appear, which lets you choose your campaign from the list of campaigns you’ve created in Charitable.
You can save, preview, and publish your page. Your campaign should appear like this:
That’s it. Your donation campaign is live, and you can start collecting funds.
Now there’s a lot more to Charitable. For every donation, you can automatically send PDF receipts.
You can also allow donors to donate anonymously, leave comments with their contribution, and refer other donors.
There are also advanced features like recurring donations, peer-to-peer fundraising, donor portal, donor management, and more.
Learn how to set up Charitable’s advanced features here »
Now let’s take a look at setting up a simple donation form with WPForms.
Creating a Donation Form with WPForms
To create a simple donation form on your WordPress site, all you need is a form builder plugin. There are plenty of form builders out there, but my #1 recommended builder is WPForms.
WPForms has been my go-to form builder for many years now. I’ve created all sorts of forms including donation, events, contact, feedback, signup forms, and more. I’ve even run feedback surveys with this plugin and the results have been fantastic.
What makes this plugin so great is that it has all the features you’ll need – all under one roof. So you won’t need to use multiple plugins.
First, there are form templates for everything and a user-friendly drag-and-drop builder that lets you customize your online donation forms in minutes, even if you have no coding experience. All you need to do is choose the fields you need, edit the text, and you’re good to go.
You can add set donation amounts or let the user choose the amount they want to donate. You can also let them choose items and display a total that’s automatically calculated for you.
If you want to add more advanced features to your form, then WPForms has you covered. It comes with smart conditional logic, which lets you display the next question based on the user’s response.
WPForms also has tons of add-ons to extend functionality. For instance, it lets you make your forms conversational style. So if you have a long form, then you can ask the user one question at a time so as not to overwhelm them right at the start.
To collect payments, WPForms lets you connect to Stripe even on the free plan. So even if you have zero budget for this, you can use WPForms to start raising funds!
On the pro plans, you can connect to more payment gateways, including PayPal, Authorize.net, and Square.
Users can then choose to pay from multiple payment methods, including credit card, debit card, internet banking, or digital wallet. It’s as easy as clicking a few buttons to enable the payment options.
Here are a few more highlights of WPForms:
- 2000+ form templates
- Instant admin email notifications
- Instant donor email confirmations
- Recurring donations
- Customizable Donate button
- Email marketing integrations
- Dedicated support
For this tutorial, we’ll be using WPForms to create your donation form.
If you want to explore other options, then I suggest WP Simple Pay. WP Simple Pay enables a simple payment form and gateway on your site.
You can also check out the Best WordPress Donation and Crowdfunding Plugins.
That said, let’s get started with creating your donation form together in just 5 simple steps.
How to Create a Donation Form
Step 1: Install WPForms
To install WPForms, log in to your website’s dashboard, go to the Plugins » Add New page. Search for “WPForms” and install and activate it.
This is a free version that gives you access to the essential features you’ll need to create basic forms on your site. It includes the Stripe payment gateway, and you’ll incur transaction fees + Stripe fees.
If you want to you prefer to remove these additional fees, and access more payment options, powerful features, and templates, then you’ll want to sign up for the Pro version.
Head to the WPForms website.
Choose your plan and create an account. You’ll get a license key that you need to copy.
Then go to WPForms » Settings page and paste the key here.
Once you activate the license, you’re ready to create your WordPress donation form.
Step 2: Create a Donation Form
Open the WPForms » Add New tab in your WordPress dashboard. This will open up the WPForms template library where you can search for “donation” and choose one of the donation form templates that best match your needs.
Once you hit the “Use Template” button, you’ll see a popup appear to enable the PayPal gateway in order to use this template. Simply click ‘Yes, install and activate’.
Now the WPForms drag and drop builder will launch.
Here, you’ll see a preview of your template on the right with an editing taskbar on the left.
This builder is so easy to use. To add new form fields, simply pick one up from the left menu and drag and drop it into your form preview.
You can click on any field to edit the text. If you want to reorder the fields, click on it and drag and drop it to where you want it to appear.
We’re going to show you how to create a smart logic form where users can choose to make a preset contribution or enter their own amount.
Step 3: Add Smart Conditional Logic (Optional)
Smart conditional logic lets you show or hide fields based on a user’s response. This makes the form shorter and improves the user’s experience.
To get started, let’s first add a ‘checkboxes’ field to the form and select it. You’ll see options to edit this field on the left.
You can change the label and the text of each field that is available. There are plus and minus buttons to add or delete checkbox fields.
If you want to make your donation form pop, you can also include images to your choices.
At the bottom of the left menu, there’s a toggle button called ‘Required’. If you enable this, then the user will have to fill up this form field before they can submit the form.
Next, we’ll add a dropdown field and add the contribution amounts that you want to offer donors. This will make it easier for them to choose an amount and make the donation fast:
Now we’ll show you how to show or hide your form fields based on the user’s response.
Choose the field you want show or hide, then open the Smart Logic tab at the top menu.
You’ll see a new menu appear on the left. First, enable conditional logic. In our example, we’ll ‘show’ this field if ‘Would you like to be a regular sponsor?’ is ‘Yes’.
Now if the user’s response is no, we’ll show them a field where they can enter their own contribution amount. To do this, add a single item payment field to the form.
When you select this field, you can configure the options here. To allow users to choose their own amount, make sure the ‘Item Type’ is set to User’s Defined.
Now we can switch to the Smart Logic tab and enable conditional logic. Then choose to show this field if ‘Would you like to be a regular sponsor?’ is ‘No’.
That’s it. Now your form is powered by smart conditional logic. Make sure you save your form, and we can head to the next step.
Step 4: Set Up Forms Notifications and Confirmations
When a donor makes a contribution, it’s important to send them a receipt as well as alert yourself or your team that a donation was made.
WPForms makes it easy to set up these automated emails to be sent to you, your team, and the person who submitted the form.
In the WPForms builder, go to the Settings tab. You’ll see the General form settings page open like this:
This lets you edit the form name, description, submit form button, and more. In the next tab called Spam Protection and Security, you can enable/disable spam protection and captcha. This keeps spammers out so you only get real form submissions.
Switch to the Notifications tab and you’ll see a default admin notification is already set up for you. When a user submits the form, and automated email with the form details will be sent to the admin email of your WordPress website.
To set up new notifications, click on the “Add New Notification” button.
Now you can customize the email address, email subject line, from name, and email message field. WPForms uses smart tags like {admin_email} that will automatically fetch your WordPress admin email.
You can click on the ‘Show Smart Tags’ to see all available tags. So for instance, when I click on ‘Name’, it autopopulates {‘field_id=”1″}. This tag will automatically fetch the name entered by the user in the form.
Next, WPForms also lets you control what happens as soon as a user submits a form. You can customize this by switching to the Confirmations tab.
This functionality has 3 options here that you can add to your contact form for WordPress:
- Message: Display a custom text message on your website itself.
- Show Page: Take users to a specific page on your website
- Go to URL (Redirect): Send users to any URL including third-party links
Choose the one you want and hit the Save button at the top.
Now let’s set up a payment gateway.
Step 5: Connect to a Payment Gateway
To be able to use a payment gateway for this form, we first need to set it up under WPForms » Settings page. Under the Payments tab, you can follow the onscreen instructions to connect to your payment gateway.
You can connect to Stripe. If you’re on a Pro plan, you’ll also get options to use PayPal, Authorize.net, and Square.
Back to editing your donation form in the WPForms builder, you should see a menu on the far-left of the screen. Open the Payments tab here.
Now you can choose to enable the payment gateway you have already set up.
quickly add an email integration. This will let you send new leads straight to your email list. You can then start them on welcome emails or an automated trigger campaign.
Step 6: Connect to Email
If you want to save your donor details to your email list, you can connect to your favorite email providers like Constant Contact, AWeber, Drip, and more.
Open the Marketing tab on the left, and you can choose your email service.
WPForms is pretty straightforward with this so you just have to follow the onscreen instructions to connect your account.
Now you’re ready to publish the contact form on your site.
Step 7: Publish the Donation Form
You can add your donation form anywhere you like on your website such as a page, post, sidebar, or footer.
First, to add the form to an existing or new page or post, open the block editor. Use the Plus icon to add a new block and search for ‘WPForms’.
When you add the WPForms block to your page, you’ll see their mascot Sullie appear with a dropdown menu.
You can choose the donation form you just created. Preview your form on the front-end and publish your page or post for it to go live on your site.
If you’re still using the Classic editor of WordPress, you’ll see an “Add Form” button at the top menu. This lets you add the form to your page.
Lastly, to add the form to a widget-ready area such as a sidebar, go to the Appearance » Widgets tab. Add the WPForms block to your sidebar or footer, and choose your donation form from the dropdown menu
You’ll find the WPForms block available in all popular page builders like SeedProd, Elementor, and Thrive Architect. So even if you’re using a page builder, it should be simple to add the form to a donation page on your site. It’ll also be easier to integrate the style into any WordPress themes you’re using
WPForms also supports shortcodes so you can use the code to embed your contact form anywhere on your website.
That’s it! You’ve successfully added a donation form to your WordPress site. You’re ready to accept donations online.
If you’re on the pro plan, you can also manage all your donor entries right from your WordPress dashboard. WPForms also shows you analytics about how your donors interact with the form and how well it’s performing.
For more advanced data, you can connect your site to MonsterInsights. Then the plugin will automatically track your forms for you and show you how they’re performing on your site.
I hope you found this beginner’s guide helpful in setting up your donation form. Next, I’ll answer frequently asked questions to lear up any doubts you may have.
Frequently Asked Questions About Donation Forms
What’s the difference between the free and pro versions of Charitable?
The free version offers basic functionalities to raise funds online. You get unlimited campaigns and unlimited donors. Your Stripe transactions will incur a fee of 3%.
The pro version provides advanced features like donor dashboard, donor managements, multiple payment gateways, and detailed campaign analytics. There are no transaction fees on the pro plan.
Can I use both Charitable and WPForms on the same website?
Absolutely. Many users prefer the robust campaign management of Charitable and the flexible form creation of WPForms.
Is coding knowledge necessary to use these plugins?
No, both plugins are designed to be beginner-friendly with drag-and-drop interfaces and setup wizards.
Are there additional costs involved beyond the plugin price?
Besides potential plugin subscriptions, transaction fees from payment gateways might apply.
Can I set up automated donation receipts?
Yes, Charitable auto-generates a receipt upon completion of a transaction on your site. You may allow the user to download it instantly or send it to their email. If you’ve enabled the donor dashboard, donors can also log in to their profiles and get their donation receipts any time they need.
WPForms also lets you set up automated emails with a summary of the donation form that can serve as a donation receipt.
If you’re sending donation confirmation emails using your WordPress website, you’ll likely face email delivery failure issues. I recommend using WP Mail SMTP, it will resolve all those problems and ensure your emails are delivered.
Up next, you may also want to create a donor’s portal or membership area on your site. See our list of the 7 Best WordPress Membership Plugins that help you do that.
Leave a Reply