Step one
Install the plugin Quasar Form free or Quasar Form pro. In this plugin, we create a form that we will use for a quick order.
Step two
Install the Quasar Form Add-on for WooCommerce (free) or the Quasar Form Pro Add-on for WooCommerce (paid).
Step three
Go to the addon settings. In the “Main settings” section, the first field is a form selection, a list of all forms created in Quasar Form is displayed here, select the desired form. After selecting, click the save button, it is at the bottom of the page. If your store has already created products, then you can check – the quick order button has already appeared.
The next setting in the section is the text that will be inside the button.
Step four
If you need a new order in WooCommerce to be created when submitting the form, then leave “Yes” in the last parameter of the “basic settings” section. Next, you need to bind your form fields to order fields in WooCommerce. This is necessary in order for the data that the visitor has filled in the form to get into the WooCommerce order. If you do not need to place an order, skip this point.
The principle of operation is very simple, if there is a telephone field in the order form, then we indicate it in the telephone section, if there is a comment field, we indicate it in the comment section.
The fields that you will see in the settings are the fields from the selected form. If the list is empty, it means that no field suitable for this section has been created in the form.
Step five
We set up the block with information about the product.
You can turn off the display of product name, product image, price and quantity. You can also add text above the price and the quantity field.
Step six
Go to design section. We customize the design of the block with information about the product. Also, here you can set the indent and alignment of the quick order button.
Note. You set up the button and form design in the Quasar form plugin (Quasar Form -> Design -> Button design).