Add a Form to Take Payments with Gravity Forms: Allowing User Defined Fields as well as Set Amounts

Screen Shot 2013-09-12 at 5.21.58 PM 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).

Screen Shot 2013-10-13 at 3.53.41 PM
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.)

Screen Shot 2013-10-13 at 3.54.05 PM
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.

Screen Shot 2013-10-13 at 3.54.21 PMIf 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

4 thoughts on “Add a Form to Take Payments with Gravity Forms: Allowing User Defined Fields as well as Set Amounts”

  1. Pingback: Add a Payment Page to my WordPress Site with my First Data Merchant Account - Cullen Web Services

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top