Select Page

Applying a Quantity-Based Discount to Your Gravity Form

Description

Gravity Forms is a powerful tool for so many uses. In this tip, I'll show you its power for e-commerce as we look at how to apply purchase discounts based on the quantity purchased.

This post may contain affiliate links. If you purchase something through one of these links, I will receive a small commission at no additional cost to you. Your trust is important to me and I only recommend products that I have tried and believe in. Read my full disclosure statement here.

Tools Used

i

Gravity Forms - Any License

f

Gravity Perks Copy Cat

You can buy the basic license if this is the only perk you need. You may find a need to upgrade after you discover all the cool things you can do with Gravity Perks. But no worries, you can upgrade at any time!

f

Gravity Perks Read Only (Optional)

Tip

Use Case

There are a number of ways to give discounts using Gravity Forms. You can use the Gravity Forms Coupon Add-On to offer coupon codes. For more flexibility, you can use the Discount Field that comes with Gravity Perks Ecommerce Fields, or you can use the Gravity Perks Conditional Pricing to automatically change the price based on certain parameters.

In this case, I am looking to give a quantity-based discount, meaning that the form will calculate a dollar amount off of each item purchased.

Steps

Step 1: Set up Your Fields

In this example, I am selling a widget for $5/each and I want to give a discount of $1/each when the discount code “SunnyDay” is entered.

I set up the following fields:

  • Product: Widget $5
  • Single Line Text: Discount Code
  • Product: Sunny Day Discount -$1, conditional logic: show if Discount Code is SunnyDay
  • Total

Product

Enter the name of your product and select your price. If pricing is more complicated than a single price for the product, you can use the Option field to add variations of the product, or you can use Gravity Perks Conditional Pricing to change the price of the product based on certain variables.

Discount Code

This is a simple Single Line Text field with no customization.

Product Discount

In order to apply the discount on a quantity basis, we need to create a product field with a negative product cost. We don’t want our visitors to input this quantity (they would be able to get the product for free if they wanted!), so we will use the Copy Cat perk to populate the quantity here (we’ll set that up in the next step).

Since the quantity of this field will be populated automatically, we need to use conditional logic to ensure that the discount is only applied when the right discount code is entered. So we will set up the conditional logic of this field (on the advanced tab of the field editor) to Show when Discount Code is SunnyDay (or whatever discount code you are using).

Total

This is a straight forward total field with no customization needed.

Step 2: Set Up Gravity Perks Copy Cat

Once you’ve installed the Gravity Perks plugin, find the new Perks menu item under Forms in the Admin menu bar. Select “Install Perks” and choose the Copy Cat perk from the list. More detailed instructions are available here.

The Copy Cat perk works behind the scenes so you won’t see any changes to the form builder once it is installed.

In our case, we are copying the quantity from one product field to the quantity in another product field. A product field has multiple inputs so we will need to target a specific input. First find the Field ID of your original product field. Mine is 1. Quantity is the 3rd input in the product field, so I will specify this input only by identifying it as 1.3. Next you’ll need to do the same for the product discount field. Mine is Field ID 2, so I will specify the quantity field as 2.3. If your fields are set up differently, the documentation for this plugin walks you through other options.

Because we want to automatically copy the information from one field to the next (instead of relying on an action like a checkmark to trigger the copying), we will enter our instructions in the original product field. To do this, navigate to the original product field editor and select the Appearance tab. In the Custom CSS Class box, enter “copy-1.3-to-2.3” and then update the form. You can preview the form to test that it works.

Step 3: Preventing Unwanted Changes

We’ll need to prevent our visitors from making changes to the discount product field. There are a few ways to do that. If the product discount field can remain hidden, you can enter CSS code “gf_invisible” on the Appearance tab of the field editor. (This has the same effect as using Gravity Perks Conditional Pricing, so if you have the higher level of Gravity Perks, using that perk instead of this method will save you a few extra fields.) However, you may want visitors to be able to see the discount so that they know it was applied. If you want the field to be visible, just not editable, you can use JavaScript to make the field read only or you can install the Gravity Perks Read Only plugin. (You’ll have to upgrade to the Advanced License of Gravity Perks to be able to install more than one perk. I told you it wouldn’t take long before you were upgrading!)

Alternatives

Multiple Discount Codes

You can set this up to work for multiple discount codes if you are offering the same discount amount for each. Just change the conditional logic to apply to Any instead of All and then click the plus to add multiple discount codes. If you need to use and/or logic, see my tip on that here. You could also offer a discount of different amounts based on the discount code entered. For this, just set up multiple discount codes and use the conditional logic as described above to apply the discounts based on which discount code is entered. For example, I could set up one product field to give a discount of -$1 for the discount code SunnyDay, and another product field to give a discount of -$2 for the discount code RainyDay.

Multiple Products

You can also set up this discount to apply to multiple products. To do that, you would need to set up an extra hidden field that counts the total number of discounts to apply. Add a number field and check “Enable Calculation”. Use the Merge Tag drop down to find the Quantity Field for each product and add a plus sign between each one. Once all of the product quantity fields are calculated in that box, navigate to the Appearance tab to enter the CSS class. You’ll enter the Copy Cat CSS Class on this field instead of any of the original product fields. Identify the Field ID of this number field and the destination Field ID of your discount product field. Then in the CSS box, enter it as follows “copy-6-to-2.3” where 6 is the Field ID of your calculated number field and 2 is the Field ID of your discount product field.

Wrap Up

Now you’ve created a Gravity Form that includes quantity-based discounts! Test it out below.

Submit a Question or Comment

0 Comments

Submit a Comment

Your email address will not be published.