We are building a more efficient WooCommerce Wholesale Order Form v2.0 powered by React JS with exciting new features and improvements such as making it much more lightweight to boost the speed and allowing you to customize the style easily from the backend using a drag and drop interface.
This order form v2.0 beta is available for early access. If what you need isn』t too complicated or you just simply can』t wait to check it out, feel free to try it!
Kindly note that we don』t recommend using it for production environments yet. Some integrations and features may be incomplete or not working to the same standard as the current stable form.
How To Enable The Order Form v2.0 Beta
In this step-by-step guide, we will show you how to easily enable the order form v2.0 beta.
1. Generate WooCommerce API Key
The new form relies on the WooCommerce API. In order to use the API, the order form will need its own API access key.
You can generate one from
Copy the key and secret and go to WooCommerce ➝ Settings ➝ Wholesale Ordering tab ➝ Beta in the submenu, and paste them in.
Next, click 「Auto Generate」 and it』ll generate the WooCommerce API Key automatically for you.
2. Enable Beta Access
Click the 「Enable React JS Order Form」 checkbox to enable the form v2.0 beta.
3. Create Your New Form
In the order form v1.0, you could only have one form. In the new order form v2.0, you will be able to have multiple forms and each form has its own shortcode that you can place onto a page.
To create a new form, simply go to WooCommerce ➝ Wholesale Order Forms ➝ hit the 「Add Form」 button.
This 「Wholesale Order Forms」 page will show the list of all order forms you have created. You can see the shortcodes, where the form is located and the status whether it』s been published or not.
There are three main sections on the form:
Order Form Header
Order Form Table
Order Form Footer
For the header and footer, you can add sections and determine how many columns you want on each section. You can then drag elements into those sections.
There is only one section for the product listing table. You can drag the elements from the right over to the table and arrange the rows how you like.
If you click on the settings button (a pencil icon) of an element as you wave over it, you will be able to see configuration and styling options on the right side.
Once you are happy with your form, click the 「Publish」 button on the top. This will generate the order form』s shortcode.
Copy and paste the shortcode onto a page to show the order form on the front end of your site.
Current Scope & Limitations
Things we』ve worked on already and are considered working:
Form layout and display – products can show including variable products (each variation is shown individually or in a dropdown).
Speed – it』s lightning-fast and we』re aiming to keep it that way.
Multiple order forms – you can have more than one form in the system now
Each form has a shortcode that can be placed anywhere to show a custom order form
Element level configuration & styling – we』re working on improving this but you can alter the behavior of individual elements on your form
Things that still need attention:
It』s mostly integrated with WooCommerce Wholesale Prices Premium, but there are still some smaller features we』re yet to tackle.
No third-party plugin integrations (e.g. WPML) as yet but we』re working on it.
Improvements to element level styling
Improvements to settings placement for elements
Found a bug in the v2.0 beta form? Report it to us 🙂
We』re more than happy to assist anymore in trying our new order form and are very grateful for any feedback you have for us.
As mentioned this is a beta feature so there』s bound to be a couple of bugs (though we are testing thoroughly as we go!).
If you need assistance in setting up your order form or find a bug, please send a message to our support including the steps you have figured out to reproduce the issue. It would also be helpful if we could get a copy of your WooCommerce Status report along with it.