How to Add a Donation Page to Your Non-Profit or Charity WordPress Site

By October 5, 2016Non-Profit, Website

WordPress is the ideal platform for charities and non-profit organisations.

It’s free and open source and you have access to a huge community of users and developers who can help you build and manage your site.

But one of the most important functions of a website for many nonprofits is to encourage people to donate money.

So in this post, I’ll show you just how to do that. We’ll go through five steps:

  • Creating a site and customizing it
  • Installing and configuring two plugins, including linking to Paypal.
  • Creating a form with donation options.
  • Creating a donation page and adding the form to it
  • Improving the page and form to encourage people to donate.

So let’s get started!

Create and Customize Your Site

If you’re an established non-profit organisation, you’ll probably have already followed this step. I’ve created a simple demo site to demonstrate the techniques from this post, so you can follow that if you’d like.

I’ll be using the twenty sixteen theme for my site, but you’ll probably have your own theme already installed. So you don’t need to use the same theme as me: this technique will work with any well-codd theme. But make sure your theme is responsive so people can donate on their mobile devices.

Here’s my site. It’s got a home page and a donation page, and I’ve set the homepage as a static page:

Site running twenty sixteen with a static home page

Install the Plugins

The next step is to install and activate the plugins you need to add your donation page. I’m using the Gravity Forms plugin. You’ll also need to install a plugin that links Gravity Forms up to Paypal – the Gravity Forms Paypal Add-on.

These are premium plugins and you will need a developer license for the Paypal add-on. However they include features that will encourage people to donate more and should pay for themselves over time. I tried to create a donation form using free plugins and just couldn’t get them to work well.

Go ahead and install and activate your plugins by downloading them from the Gravity Forms site and then uploading them to your site. You do this by going toPlugins > Add New and then clicking the Upload button. You’ll see a Forms item added to your admin menu:

A Forms item has been added to the admin menu

Setting up Gravity Forms

First you’ll need to set Gravity Forms up and add your license key. Go to Forms > Settings and you’ll see a field for your key. You were sent this when you registered for Gravity Forms. Add it to the field then click the Next button.

On the updates screen, click Next to have the plugin auto-update, then on the following screen, add the currency you’re using. Click Next again.

Linking Gravity Forms to Paypal

Before you can add Paypal to your form you’ll need to configure the settings to link Paypal and Gravity Forms.

Go to Gravity Forms > Settings and then select PayPal from the tabs on the left to see the settings screen:

Instructions for linking paypal to gravity forms

This screen gives you instructions you need to follow in Paypal to link the two:

  1. Go to your PayPal IPN Settings page using the link provided.
  2. If IPN is already enabled, you will see your current IPN settings along with a button to turn off IPN. Just check the confirmation box.
  3. If IPN is not enabled, click the ‘Choose IPN Settings’ button.
  4. Check the box to enable IPN and enter the Notification URL that’s provided on the screen in your Paypal settings (copy and paste it).

Doing this lets Paypal and Gravity Forms talk to each other. Your screen in Paypal should look something like this:

paypal-ipn

When you’ve done all that, check the button to confirm that you’ve linked Paypal and Gravity Forms.

Now you can create your page and your form.

Create the Donation Form

Now for the fun bit. You’ll need to create your form first and then add it to your donation page.

Creating the Form

In the admin screens, go to Forms > New Form.

In the popup box that appears, ad the title and (optionally) the description for your form:

Adding a form - enter the name and description in the popup

You’ll now be taken to the screen for adding form fields.

Go ahead and add any fields you need to capture data. Remember that the more you include, the less people will complete the form. So only add this fields you really need and make as few of them as possible mandatory.

I’m adding the following fields:

  • Name
  • Email address
  • Message of support

Only the email address is required, so the system can send confirmation of receipt. You’ll find the fields for the name and email address in the Advanced Fields box and the text field in the Standard Fields box.

To edit a form field (include changing its label and making it required), click on its name on the left hand side of the screen and use the editing metabox that appears.

Finally click Update Form to save it.

Here’s my form:

add-contact-form2

Add Payment to Your Form

Now let’s add some payment details to the form. I’m going to add a few options for the amount people might like to donate – it often encourages people to donate more than they might have otherwise. I’ll also add a field where people can add their own amount if they want.

From the Pricing Fields box on the right hand side, add the Product field type to your form.

Now you need to edit the product itself. First give it a new name (mine is Donation). Then in the Field Type dropdown list, select Radio Buttons.

This lets you define the values for your radio buttons, i.e. the suggested amounts. Add some amounts – don’t add too many or you might put people off. Your final option should be a zero amount with a label of Other (or something similar). If a user selects this they’ll be promoted to enter their own amount.

 

Source: WPMUDEV