How to Create a Donation Form

thank you so much for watching the press
Avenue YouTube channel my name is John
and I like to talk about WordPress
plugins themes and how to better use
WordPress for your business or personal
site today I'm talking about how to
create a donation form within WordPress
where you can collect money for either a
non-profit or anything else so we get a
lot of questions on our Facebook group
which is facebook.com slash group size
pres Avenue where people can come and
ask questions about these videos and
also get help from myself and other
people within the community I'll put a
link for that below so let's get started
so the plugin we're using is called WP
forms they have a WP forms lite version
which is in the wordpress repo we've
done videos about this in the past and
it allows you to create a simple contact
form or collect any kind of information
from people on your site they have a pro
version which then allows you to process
money and that's what we're talking
about today basically how to create a
simple donation form within WordPress
itself now if you go to the pricing
these things are always on sale which is
great but we're basically using this Pro
1 here
additionally you could use the elite as
well but we're looking for this add-on
here that allows us to use PayPal now I
know some people may cringe at this
price tag but if you market your
donation form this should pay for itself
within a month if not within the week
and then from then on it's just gravy
and you can get money for your nonprofit
so let's get started let's go to I
created a donation site for an animal
sanctuary in zoo it looks like this some
of the titles are filled in but the rest
as you can see here is just dummy info
but we want to create a form where we
can input it into a page and then allow
people to send us money which is what we
all want if you want to see how to
create a page like this just let me know
in the comments all right so let's get
to it
here we are on the back end of a
WordPress website this is simply a
testing staging site so I can make
videos to show you how to do this if we
go to plugins you'll see that I have WP
forms the pro version installed with the
latest update as of June 2020 these
other things Elementor really great
plugin page builder I have other videos
on that which you don't technically need
any of these you can use any theme page
builder plug-in etc along with WP forms
to create your forms so now we're gonna
head over to WP forms and then these
forms here are just ones that I've
installed on this site again yours will
look different but you can create a
simple contact form a quote form footer
form file upload anything you can come
up with you can create with WP forms so
first we're going to go to add new
and give it a minute to load and we're
gonna name our form so let's say zoo
donation and again it can be any kind of
nonprofit any kind of site essentially
that you want to take money with but you
go ahead and name your form up here and
then what's great is it has select a
template and one of the templates is a
donation form but we're going to create
one from scratch to show you how to set
everything up so it says the speed of
the process you can select a premade
template or click blank form so you
click here or here so we're just gonna
start balanc
from scratch so you see how it's done so
typically with a donation you do want
their name and email as a minimum or you
can do name email phone and the reason
you could do a phone is if they donate a
certain amount you can text or call and
say thank you which I think would be a
really nice benefit so let's get started
with that
so first we'll click name and it adds it
in over here and it's required so that's
great next I'll click email and it just
adds it in in the order I click it and a
phone we can jazz this up a little bit
more similar to first and last name I
can have email on the left and a phone
on the right so let's go ahead and do
that it's like like email I'll click
advanced and down here it says CSS
classes but then it says show layouts so
I click show layouts and I'm gonna do
this one here where there's two columns
and I'll select my column and I'll come
down a phone advanced show layouts
column select the right
alright next we will go to add fields
and then I am going to add a single line
and then this allows people to dedicate
their donations if that's something you
want I do see this a lot with nonprofit
websites your donation to and then they
can fill it in or not let's clean this
up so say you want to dedicate it to
your grandma you can put her name in
here and then I do not make this one
required which of course you can next to
add fields you can ask for other things
in here but typically I then go from
here and go to the payment fields at the
bottom again you do need that WP forms
Pro but it can definitely pay for itself
quite quickly by asking for donations on
your site which will allow people to use
credit cards and debit cards instead of
having to hand it to you or mail it to
you so it's all about convenience and
people do like convenience
all right so payment feels let's add a
single item so right now it's a single
item price so I'll click this we want
this to say donation amount you can put
a description for what it's going to if
you want say you have a capital campaign
a building campaign or other campaigns
that were for your nonprofit you could
put the description in here to what this
was going to you could also create
separate forms for different campaigns
which is really great which helps you
keep track of where this is coming from
and then ask for a price but that's not
quite what we want we actually want to
go to item type and we want to do user
to find this way the user can enter in
any amount and that can be processed and
I would make this required
all right so user defined price so I can
come in here and say I'd like to donate
$10 to your nonprofit I enter in 10 and
good to go other things you can do or
might want to consider is we have the
donation donation amount here but maybe
we want multiple items and or checkbox
item so let me show you what I mean
multiple allows you to select one of a
group so you could say I want this to go
towards the capital campaign only
checkbox items allows you to select a
few items along with your donation
amount here so let me show you I'll say
checkbox items and since this is for our
imaginary nonprofit which is a zoo I
will say support these let's see
consider supporting these animals
let's do first item we'll say for $100
you can support the hamsters and I'll
change this number here so I put the
hundred in here initially so the user
can see what this checkbox is you know
worth and then the hundred here is the
amount that's gonna be processed next
I'll say let's say 250 to feed a hippo
for probably a day I'll change this to
250 and lastly I'll say a thousand
to help build an elephant barn why not
you don't know if you don't ask then
people won't know you can drag the order
here but this order makes sense based on
the numbers and then also we can use
image choices so I click image then you
can see here puts it into three columns
and it says the placeholder is 200
pixels by 125 so go ahead and click
upload I already have the hamsters in my
media library so click hamster use and
you can see it there hippo I'll show you
can just drag an image in so here's my
hippo picture and be sure to put in the
alt text when you do upload the picture
so let's say use and then the elephant
bar and same thing we will drag in the
image
and use and now we've kind of jazzed
this forum up a little bit because
before we just had all these columns now
your eyes probably go straight to this
consider supporting these animals as
well and this could this could be
anything I mean just whatever you come
up with so you can check this box and
you see the check over the hamster that
means that one is selected so when they
check it that's what it'll do if you
want to force a check automatically you
can do that by checking this box now if
you did the field that's just multiples
you can only select one which you might
want to do if you didn't have this
initial donation amount at the top all
right so I'm not going to make this
required because I'm saying consider
supporting these animals alright next
under add fields I would add a you can
do a drop-down as well but we're gonna
add a total just so they can know they
don't have to do the math between the
donation amounts and selecting one of
these so I'll say donation total and
that's it so that's the first part of
the set up I'll go ahead and hit save
next we're gonna set up paypal to accept
this money so over on the left hand side
it's pretty easy the dollar sign that
says payments I'll click at that and now
it says install your payment integration
what's nice about this is I don't have
to go login to WP forms account and
download the add-on I can click here and
it says hey it's not installed would you
like to activate it I'll say yes install
and activate yes refresh it and now
PayPal standard is now installed and
ready to integrate into this form so
there we go click PayPal I'm going to go
ahead and click enable you put in your
paypal email address PayPal so I'm put
in mine
mode you can do a testing sandbox mode
so if you want to maybe send this to
your executive director or your board
and have them test it out to feel out
how this whole thing works you can do a
sandbox test mode but we'll just select
production the type payment type
it's either products or services or
donation so say you are a non-profit
selling raffle tickets in my state it
would actually have to be products and
services but if you're asking for a
donation it would then be donation so
let's say donation cancel URL so this is
if they want to cancel it or it doesn't
go through you can send them to another
page that says hey please call our
number or email us and we'll help
process your donation and then you can
walk them through sending a check or
doing anything else
shipping you can ask for an address but
do not require a lot of people do this
so they can add them to a mailing list
and then lastly do not aspire to include
a note with the payment this is up to
you typically I turn this off you can
either put a description in the form
itself that says if you have any
questions click our contact box but
people do tend to miss notes that are in
PayPal and you don't want to miss
something that someone asked so there it
is there I'll go ahead hit save now this
is all saved and done so what I'm gonna
do is I'm gonna go back to my nonprofit
page and just refresh and then I'm going
to edit it in Elementor but again you
can do this in Gutenberg beaver builder
any page builder or just regular
WordPress block editor it all works the
same so I'll click Edit I'll give it a
moment to load and then this is similar
to the block editor aka Gutenberg where
you would search hit the plus sign and
search for WPF ORMs so that is there I'm
just gonna drag it in
let's see here let's put it right here
all right so it says title I think she's
not gonna add a title I'm going to say
Zoo donation and then display the form
name is fine and if you put a
description in which I didn't it would
show there so then here's my donation
form live in the site again it works
just the same in the block editor we've
named email phone I can clean up the
spacing there dedicate your donation to
donation amount and then this time to go
ahead and hit update
and then let's apply this just in case
we'll let it load
go back up all right so let's preview
this
all right so here's my donation site got
cute bunnies and penguins and then
here's my form here so I'll put on my
name my email my phone actually I'll
skip that I'm gonna dedicate it to my
YouTube viewers
all right donation amounts let's say $10
if you see down here this is
automatically totalling my amount so if
I put $100 it's 100 now down here it
says consider supporting these animals
let's feed a hippo for a day now if you
see it's adding the two fifty and a
hundred and we have a total of 350 so
don't let people have to do the work
let the spoon feed them and let them
know how much they're actually donated
elephant barn I can select that as well
so you can see how I can select them all
I can select one it doesn't matter I
think this is a really great layout now
when I hit submit what happens is it'll
now pull up PayPal so it's sending me in
a PayPal saying hey you're gonna pay
this company three hundred and fifty
dollars basically so now we're logging
in a PayPal just give it a moment so it
says here purpose donation amount we're
supporting the animals and a donation
amount for 350 we would then go next and
pay with PayPal now I'm not gonna finish
this step I'm not gonna pay myself 350
but that is how you do the whole process
if this video is helpful in any way I'd
love a thumbs up additionally hit that
red subscribe button so you can see more
WordPress tutorials like this
additionally if you have other questions
please let me know in the comments below
or you can head over to our Facebook
group facebook.com slash group slash
press Avenue and ask about this tutorial
or other ones or anything else related
to WordPress itself thank you so much
for watching the press Avenue YouTube
channel
[Music]
[Applause]
[Music]
[Music]