Search

WooCommerce Gravity Forms Product Addons

Create product add-ons using Gravity Forms ↑ Back to Top

With the Gravity Forms Product Add-ons extension, advanced product configuration forms can be built and linked to any product in WooCommerce. Forms that contain conditional logic, pricing fields, user input prices, conditional-pricing fields, conditional submit button logic can all be created for your products. Additionally, any product that contains a Gravity Form is tracked in the cart to ensure, no matter how complex your product form only unique configurations are added to the cart and duplicates are incremented in quantity.

The Gravity Forms Product Add-ons extension gives you full control over how the display of the prices in the store should appear. You can use the default price displays that WooCommerce will display, or in the case of a configurable product containing pricing fields, set the price to something such as “As Low as $1000″.

You also have control over when the built in automatic price calculation will be displayed, if at all, and have the ability to configure each label individually.

This extension requires you own the Gravity Forms plugin

Quick Tips ↑ Back to Top

  • Any license level of Gravity Forms will work with this extension.
  • If you are having trouble with a form, calculations,  conditional logic, etc… make sure the form works as expected on a regular post or page.  Often times calculated fields or conditional logic are not configured as expected and it’s easier to track this down when using just the gravity form and not having it attached to a product.
  • Make sure you do not use any custom Confirmation settings on the form.  Leave the default confirmation set to text with an empty message.

Configuration ↑ Back to Top

Required Configuration
The plugin does not require any manual configuration after activation.

Optional Configuration
A configuration change you might need to set is how HTML is formatted from specific Gravity Forms field types. One of the more common requests is to have the HTML from the List type field show as HTML and not a CSV list of data. To do this you can use a filter to turn off HTML stripping in the plugin.

To turn off HTML stripping add the following to your functions file in your theme:

add_filter(‘woocommerce_gforms_strip_meta_html’, ‘configure_woocommerce_gforms_strip_meta_html’);
function configure_woocommerce_gforms_strip_meta_html($strip_html){
$strip_html = false;
return $strip_html;
}

Supported Gravity Form Fields and Features ↑ Back to Top

Standard Fields
  • Single Line Text
  • Drop Down
  • Number
  • Radio Buttons
  • HTML
  • Paragraph Text
  • Multi Select
  • Checkboxes
  • Hidden
  • Section Break
Advanced Fields
  • Name
  • Time
  • Address
  • Email
  • Date
  • Phone
  • Website
  • File Upload
  • List ( Partial support, the column values are stored in WooCommerce as a CSV list of data, not the raw HTML )

Pricing Fields

  • Product
  • Option – Drop Down
  • Option – Check-boxes
  • Option – Radio buttons
  • Total
  • Quantity
  • Shipping

Getting Started Guide ↑ Back to Top

Build a Gravity Form that contains any of the supported field types. Be sure to leave the Confirmation settings as the default text with an empty message.  Configure any conditional logic, and optionally submit button logic required. In the example below the form is configured to use pricing fields. When using pricing fields, Gravity Forms requires a product and total field. Typically you will add a hidden product field to the form and set it’s price to the price you require the customizations to start at.

gravity_forms

Add a Product Field to the form so we can configure our base customization price starts and set it to $0.00:

gravity_forms_2

The Gravity Forms Product Add-on requires that at least one total field be present on the form. Add a total field to the form. In this example we are using the built in dynamic price calculations on our single product page. To prevent the customizations total from being displayed twice on the single product page ( once in the dynamically calculated price area and once in the gravity form itself), add a class of hidden-total to the field:

gravity_forms_3

To add options to your form you should use the Option field type from Gravity Forms.   You can use other controls, such as the standard drop down, however you must use the option field if your option has a cost associated with it.

Please note: If you have options that have a cost associated with them, you must use the Product Option field type, not standard dropdowns, radios, check boxes etc..   This is the standard way that Gravity Forms works.  If you have trouble creating the product form, Gravity Forms documentation has several good examples.

Once you have built your form and are satisfied with the functionality, create or edit an existing WooCommerce product. With the Gravity Forms add on enabled you will have options for linking the form, options for displaying the Gravity Form title and description, and options for displaying alternative price titles throughout the store. You also have the ability to control how the dynamically calculated price is displayed on the single product page.

gravity_forms_product

After your options have been configured, publish or update your product. Navigate to the product in the store and see how your form has been linked to the product

gravity_forms_product_view

FAQ ↑ Back to Top

What is the best way to use these forms while keeping my website fast?

Make each individual product into a separate Gravity Form Page. Using conditional logic on each separate product page (rather than trying to provide every variable possible on one page) will keep your website fast. Each field that has conditional logic requires an AJAX post back, so rather than having 25 fields that have conditional logic, there would only be 5. Using the multipage approach should take care of any lag issues.

Why are duplicate entries created?

The Gravity Form add on does multiple calculations and processes the data twice to make sure everything is working before adding it to the cart. This is why there are two entries. The good news is that you don’t need to use the form entries screen. All relevant information should be included in the order.

Why won’t Gravity Forms show on the front end?

Products that have an empty ‘price’ field won’t display Gravity Forms Add-ons. Make sure to place a value as is shown:
Screen Shot 2014-10-02 at 10.15.15

Can I use Gravity Forms Add-Ons to send emails?

Gravity Forms Addons does not send email notifications when they are assigned to a product.

Back to the top