I have been experimenting with using WooCommerce to set up a site to collect donations, on both a one-time and recurring basis.
Here is a screenshot of the
finished product work in progress:
I’ve set this up with a number of WooCommerce’s paid extensions. I’ll start with the essentials, then tell you about the optional bits.
- A website built with the WordPress.org Open Source Software
- WooCommerce Subscriptions & a compatible gateway (I used Stripe)
- WooCommerce Name Your Price
- WooCommerce Variation Swatches and Photos
Step One: The Basics
Step one is to have your WordPress site set up, and install WooCommerce, as well as the other plugins I listed above.
Step Two: Subscriptions Settings
In your site admin area, visit your WooCommerce > Settings > Subscriptions. You can set most of this up to suit your preference, but I made three specific changes:
I changed both the Add to Cart button text and the Place Order button text to Donate Now.
Also, I set it to Allow Switching Between Subscription Variations. This means that our donors will be able to log into their account anytime, and increase or decrease the amount of their ongoing donations.
Step Three: Product Setup
Set up the donation product as a Variable Subscription. You will do this in your site admin, Products > Add Product.
You will choose Variable Subscription from the Product Type dropdown.
Step Four: Attributes
Add Attributes, for “Amount” and “Frequency.” Be sure to check “Used for variations.”
Step Five: Variations
Set up the variations. I set up for four amounts: $10, $20, $100, or name your price, on a one-time, monthly, or annual basis.
At this point, you will have to toggle open each of these Variations, and configure the details. For example, for the $20 Monthly Variation:
And for the Name Your Price Option:
The one-off donations are a little more tricky! For these, you are going to set up a subscription for every day, but with a subscription length of only 1 day. We tweak this a bit later in the process, so hang in there if this doesn’t sound quite right, so far.
Lastly, I visited the Swatches tab, and set the attributes to both display as Radio Buttons:
Step Six: Tweaking!
Now, after you have worked your way through and configured each and every one of the Variations, we are getting closer to the finished product. But there are some bits, which I have outlined in blue below, that still aren’t quite right:
I removed the From: $10.00 by adding this custom snippet to my child theme’s function.php:
Then, I changed the goofy wording of “every day for 1 day” with a pair of snippets. This targeted the “every day for 1 day” but also awkward wording that turned up with the other options.
I also used Loco Translate to change a string of text in WooCommerce Subscriptions, from First renewal: %s to Next: %s, so it looked a bit cleaner in the cart and at checkout.
Additionally, since we don’t sell any other items on this site, I didn’t use a shop page, and I redirected all shop links to the single product page, with this filter:
From here, you are pretty much good to go. You will need to setup and configure your compatible payment gateway, and of course, test the system to make sure it is working as you like.
Stripe has a very easy way to set up test credentials, meaning you can do as many transactions as you like, before turning this loose on your donors.
There are a few extra things I did here. I used Gravity Forms, and WooCommerce Gravity Forms Add Ons to set up that Note on the product, to allow the donor to purchase it in someone else’s honour, and arrange a gift card.
I also used WooCommerce PDF Invoices, and customized the template, to automatically attach a charitable tax receipt to each Order Completed email.
WooCommerce Order Status Control brings it all together, fully automating the system, by moving the order Status to Complete upon successful payment (triggering the receipt email).
This isn’t yet a perfect solution – there’s room for improvement and further cusotmization. For example, the Thank You page for a one-time donation still refers to “your subscription”, and so does the email. Next step: customize that!