The Definitive Guide to Integrating Gravity Forms with WooCommerce

Gravity Forms is perhaps the most popular forms plugin for WordPress and, by extension, WooCommerce. A Gravity Forms WooCommerce integration lets you supercharge your online store, deliver more value to your customers, and generate user engagement.

With this in mind, in this article, we’ll walk you through a complete tutorial explaining how you can integrate Gravity Forms with WooCommerce using Gravity Perks to:

• Connect Gravity Forms to WooCommerce
• Add conditional pricing to WooCommerce
• Let only logged in WooCommerce customers submit a Gravity Form
• Collect repeating data from a Gravity Form
• Load logged in users’ personal information
• Create coupons for WooCommerce
• Send WooCommerce order data to Google Sheets

Let’s put everything into context before we begin.

Benefits of Combining Gravity Forms With WooCommerce

For those unfamiliar, Gravity Shop Product Configurator allows you to seamlessly create highly customizable products by embedding a Gravity Form directly into your WooCommerce product page. Take full advantage of WooCommerce’s powerful e-commerce foundation to manage payments, shipping, and taxes, while using Gravity Forms to easily handle the business logic on your form. It’s the best of both worlds!

Benefits

There are several ways you can benefit from a Gravity Forms WooCommerce integration. For example:

• Add powerful WooCommerce features such as advanced payments, shipping, reporting, and tax features to your existing Gravity Forms workflow.
• Create configurable WooCommerce products with dynamic pricing that automatically updates when users interact with your Gravity Form.
• Use Gravity Forms’ core functionality within the WooCommerce ecosystem.
• Seamlessly integrate with several Gravity Perks such as GP Populate Anything, GP Page Transitions, GP Conditional Pricing, and GP Google Sheets.

Limitations

Before Gravity Shop Product Configurator was released, there were several solutions available to combine Gravity Forms and WooCommerce. However, many of these legacy solutions are bloated and rely on sub-optimal integrations that don’t follow the best practices for each ecosystem.

Furthermore, these solutions may be more heavily weighted towards one instead of both Gravity Forms and WooCommerce. This can cause UX, code duplication, and even accessibility issues for the product that the solution is less weighted towards, which can all lead to a poor admin and end user experience.

Introducing Gravity Shop and Gravity Perks.

Gravity Shop is a product line from Gravity Wiz with a special focus on enhancing Gravity Forms in the e-commerce space. Gravity Shop Product Configurator is a plugin that makes it easy to seamlessly connect Gravity Forms to your WooCommerce products.

Furthermore, Gravity Perks is a suite of plugins that lets you combine Gravity Forms and WooCommerce in many advanced ways. Each perk adds a new feature to Gravity Forms and extends its core functionality. The best part is that they’re incredibly easy to manage directly from within the WordPress admin and they integrate seamlessly with Gravity Forms’ existing interfaces.

Now that we have a better understanding of why you might want to go for a more advanced Gravity Forms WooCommerce integration, let’s take a look at how this is possible.

Connect Gravity Forms to WooCommerce

Gravity Shop Product Configurator creates a tightly-knit integration between Gravity Forms and WooCommerce. With Product Configurator, you can embed a Gravity Form directly within a WooCommerce product, and can even update a product’s attributes based on how the user interacts with the form.

Product Configurator is fully native to both the Gravity Forms and WooCommerce ecosystems, and was built to maximize compatibility between the two. This compatibility allows you to take full advantage of AJAX, multi-page forms, conditional logic, and more!

To use Product Configurator, you’ll need to first create a Gravity Form with fields that will be used to customize your WooCommerce product. Once your form is created, you can map the form to your WooCommerce product by opening the product and navigating to: Product data › Gravity Forms › Form. Choose the form you want to map to the product:

Once your form is mapped, save your product. You’ll see a new button called Open Product Configurator Settings. Click on it to start configuring your feed!

For a full list of feed settings that can be configured, take a look at our Product Configurator documentation here.

Link Gravity Forms Entries to WooCommerce Orders

Another great feature in Product Configurator is its ability to link a Gravity Forms Entry to a WooCommerce Order ID.

How does this work? When a user submits a form with a WooCommerce product linked to it, that entry will have a notice at the top of the page that shows it belongs to a WooCommerce Cart Item or Order:

From the moment the user adds the WooCommerce product to their cart, cart events such as placing the order, checking out, recording a payment, and more are linked between the order and the form entry.

Furthermore, each Gravity Forms entry includes the WooCommerce Order ID as its transaction ID. This helps ensure that everything remains tightly linked:

An alternative option is the Gravity Forms Product Add-ons extension, which also lets you connect Gravity Forms to WooCommerce. While Gravity Forms Product Add-ons provides many of the same features as Product Configurator, it lacks the seamless integration and robust support for Gravity Forms that Product Configurator provides.

Furthermore, Product Configurator provides an unmatched level of integration and support for other Gravity Perks and third party Gravity Forms add-ons.

For these reasons, Product Configurator is the preferred choice to provide the best possible experience with WooCommerce and Gravity Forms.

Add Conditional Pricing to WooCommerce

The Gravity Forms Conditional Pricing plugin (part of Gravity Perks) lets you create flexible pricing levels for your Product fields based on conditional values in your form. Simply put, instead of creating dozens of different Product fields, you can create a single Product field (found under Pricing Fields) with variable pricing.

All you have to do is set a price and define pricing rules that will determine which pricing level is displayed on the front-end. Here’s what you need to do to get started:

Create a new form using Gravity Forms and add a Product field to it. You’ll find the Product field under Pricing Fields.

Next, head over to the Conditional Pricing configuration screen by clicking Settings > Conditional Pricing. Click on the Select a Product drop-down menu in the top-left corner to view a list of Product fields in your form.

Select the Product field you’d like to add conditional pricing to. The first pricing level will be created automatically. You can set a price for this pricing level and define the rules that should be met for this pricing level to be applied to the product. You can add as many rules as you’d like per pricing level.

Finally, use the Add New Pricing Level button to create as many pricing levels as you’d like. Click the Save Conditional Pricing button to proceed.

The Gravity Forms Conditional Pricing plugin can be used for offering:

• Tiered pricing and bulk discounts to customers.
• Conditional pricing based on the user’s input.
• Date based pricing for membership sites or online courses.
• Field-based pricing (Get 10% off by signing up for our email newsletter!)

Let Logged in WooCommerce Customers Submit a Gravity Form

With the Gravity Forms Limit Submissions plugin, you can configure your WooCommerce store to only let logged in customers submit a Gravity Form. It also lets you limit the number of entries that can be submitted by several different factors including user, role, IP address, URL, and field value.

This Gravity Forms WooCommerce integration is useful for stores that need a way to accept user-generated content submissions or let registered customers enter contests or giveaways.

The plugin lets you limit who, what, when, where, and how many times the Gravity Form can be submitted. However, for the purpose of this tutorial, we’ll explain how you can set it up in a way to only let logged in WooCommerce customers submit forms. Here’s what you need to do to get started:

Open up the Gravity Form you’d like to make available only to your WooCommerce customers. Head over to the Limit Submissions Feeds screen by clicking Settings > Limit Submissions. Click the Add New button to begin creating a new limit feed.

Configure the New Limit Feed settings by entering a feed name, submission limit, and time period. Optionally, you can also enter a limit message.

Next, use the Rule Groups option to let only logged in customers submit the form. Start by setting the first drop-down menu to Role. The second drop-down menu will automatically load all of the user roles you can restrict access by. Select the Customer user role to let only logged in customers submit the Gravity Form.

Click the Update Settings button to proceed.

To take it up a notch, you can also lock it down to registered users with Gravity Forms’ Restrictions feature which lets you:

• Limit number of entries
• Schedule form
• Require user to be logged in

Alternatively, you can combine Gravity Forms Populate Anything plugin with Gravity Forms Limit Submissions plugin to restrict members. This is possible if you’re using the WooCommerce Memberships plugin on your website. To do this, simply populate the membership expiration date in a field and then link the limit to the date. This way, your members’ yearly form limit will be refreshed automatically when they renew their membership.

Collect Repeating Data From a Gravity Form

Using the Gravity Forms Nested Forms plugin with Gravity Shop Product Configurator, you can collect repeating data from any form on your store’s product page. This sort of implementation is useful for when you need to manage complex forms (such as nested forms). For those unfamiliar, nested forms are forms within forms.

For example, if you need to put up a form on your product page that lets customers enter even more (repeating) data, you could use the Gravity Forms Nested Forms plugin to make it happen.

In simple words, the plugin lets you add a nested form field to your form which lets you select another form that you can use to gather child entries from users. These child entries will automatically be linked to the parent entry once they’re submitted. In addition to this, you can view, edit, and delete the child entries directly from the parent form where they’re displayed in a table layout.

Here’s what you need to do to get started with Gravity Forms Nested Forms:

Create two forms in Gravity Forms. One will be the parent form and the other will be the nested, child form. Next, open up the parent form and add a Nested Form field to it. You’ll find this under the Advanced Fields.

In the Nested Form field’s settings, use the Nested Form dropdown menu to select your child form.

Finally, use the Summary Fields option to select which fields from the child form you’d like to display in the parent forms Nested Form field.

That’s it! You can now use your parent form to collect repeating data from your customers.

Here’s what it can look like from the frontend:

This Product Configurator integration makes it incredibly easy for store owners to collect repeating data from individual customers. The Gravity Forms Nested Forms plugin stores the data in a neat table layout in the back-end. It will look something like this:

To take things to the next level, you can go into the Nested Fields advanced settings to set minimum and maximum entry limits, form visibility, and enable conditional logic.

Load Logged in Users’ Personal Information

The Gravity Forms Populate Anything plugin provides a flexible and powerful way to dynamically filter and populate field choices and values in Gravity Forms.

In the context of WooCommerce, you can use it to automatically load a logged in user’s personal information, as long as it’s stored in your site’s database. So, this would work seamlessly for your WooCommerce customers, previous WooCommerce orders, and WordPress users.

Here’s what you need to do to get started:

First, add a field to your Gravity Form that supports choices such as dropdown or text-based fields. For the purpose of this tutorial, we’ll add a Drop Down field to our form.

Next, go into the field’s settings and enable the Populate choices dynamically option. You’ll be prompted to select an object type. This is the object type that you can choose to populate the field with. For example, you might choose to populate the field with entries from your database, posts, taxonomy, or even a Gravity Forms entry.

Finally, use the Value Templates option to designate what object properties should be displayed.

The Gravity Forms Populate Anything plugin also lets you set filters to further refine the data that’s dynamically populated into the field. You can do this by defining rules.

It’s also worth mentioning that the Gravity Forms Populate Anything plugin lets you dynamically load just about any WooCommerce data into a form. This opens you up to many possibilities. For example, you might configure it to dynamically load product prices or product SKUs from a database. Typically, the product price is automatically included as the base price and the Product fields on your Gravity Form will be added to that base price.

There are several neat things you can do with the Gravity Forms Populate Anything plugin in WooCommerce. For example, by using the taxonomy option, you can populate WooCommerce product attributes (such as sizes or colors) into a Gravity Forms powered product form.

This way, you won’t have to manually update your product form if you decide to add or remove any product attributes later down the line – it’ll happen automatically!

Finally, this is also useful for when you need to dynamically populate customer order information for, say, a returns form. You could do this by using the customer’s order ID along with filter groups.

Create Coupons for WooCommerce

Offering customers and site visitors coupons is a great way to encourage them to:

• Fill out a form (e.g. sign up for your email newsletter or participate in a quick survey).
• Share this product with a friend-style form that gives the customer’s friend a discount.
• Create coupons for WooCommerce products when a visitor submits a form.

If this is something you’re interested in implementing on your own WooCommerce store, be sure to check out our in-depth tutorial on Creating Coupons for WooCommerce with Gravity Forms for step-by-step instructions.

Send WooCommerce Order Data to Google Sheets

Product Configurator integrates directly with the Gravity Forms Google Sheets plugin. This powerful combination enables you to send order data from your form entries directly to Google Sheets. For large sets of data or complex order requirements, Google Sheets is an extremely powerful tool that can organize and analyze your order data at scale. It’s also great for collaborating and editing sheets with other users, accessibility from the web, and its ability to integrate with other Google tools.

Best of all, Product Configurator has an option to only export order details after the order has been paid for:

Set Up Your Gravity Forms WooCommerce Integration Today

Whether you already have a Gravity Forms WooCommerce integration set up on your online store or are looking to get started, Gravity Perks’ suite of add-ons is a must-have. You’ll be able to leverage advanced features like:

• Adding conditional pricing to WooCommerce.
• Letting only logged in WooCommerce customers submit a Gravity Form.
• Collecting repeating data from a Gravity Form.
• Loading logged in users’ personal information automatically.
• Create coupons for WooCommerce customers when they submit a form.

We explained how you can set up a Gravity Forms WooCommerce integration by yourself and, hopefully, you’re in a good position now to take the next steps.

Which Gravity Forms add-on will you use to enhance your customer’s shopping experience? Share your ideas in the comments section below!