I wanted to add a form to take payments to my payment page. I decided to user Gravity Forms. I am pleased with the result.
I wanted my form to take either a payment amount that I set or to allow the user to enter the amount they would like to pay. I wanted the default to be that the user enter the amount they wanted to pay. I decided that to enter my own payment amounts, I would pass the variables using the url with the GET method. I can pass in the product name, the amount, and the quantity via the URL to change the information on the page, like this:
// https://cullenwebservices.com/payment/?user=false&amount=20&product_name=web+maintenance&quantity=1 //
I’ll explain the user
variable in a bit. The other variables will fill in the form dynamically. I just used the dynamic settings on the pricing product field to set these variables. Using the short code for the Gravity Form in the page allows the variables to be passed in automatically.
// [[gravityform id="3" name="Payment" title="false" description="false"]] //
So, setting them in the product pricing field was all I had to do to make this work. Now I can set up my link from where ever I need to link to the payment page.
Since I want to allow the user to define their own amounts IF I don’t pass in the GET variables, I need to add the user defined amount fields to the form. But, I don’t want those fields to show up if my variables are passed in. So I needed a way to show that the variables were being passed in because Gravity Forms doesn’t allow me to make a field conditional on the pricing variables (unfortunately).
To solve the problem, I created a hidden variable show_user_amount
and set the default variable to true. (This is why I use the user=false
GET variable on the URL when I want to pass in my own amount, quantity and product name.)
I then made the pricing field for the user defined amount conditional on the show_user
hidden field being set to true
.
When I pass in variables, I must include the user=false
variable so that my hidden variable is set to false which tells my user defined field not to show up.
I wanted my users to be able to tell me not only the amount they were paying but also the reason they were paying. I created an option on the user defined product field so that they could indicate what their payment was for.
I made it checkboxes in case it was for more than one product or service that I offered. I also add an other
option in case they were paying for something not on my list.
If they choose
other
I want them to be able to specify what it’s for, so, I created another text field that is conditional on the reason being other
. Now this field ONLY shows up if the user defines the amount and selects one of the reasons as other. Works like a charm!
You can see all this in action on my site. Choose the option other
and you’ll see the other reason field appear.
Use this link to see how my url will pre-fill the variables and hide the user-defined amount field: https://cullenwebservices.com/payment/?user=false&amount=20&product_name=web+maintenance&quantity=2
Pingback: Add a Payment Page to my WordPress Site with my First Data Merchant Account - Cullen Web Services
I’m glad to hear you are happy with Gravity Forms as a solution. Good job getting that set-up. All my best!
Thanks David!
Great stuff! You just showed me how to setup it correctly! 🙂