If you enable WooCommerce integration for your JetAppointments plugin, you can adjust online payment right after the visitor books the service. It seems to be a must-have option for having a successful business, isn’t it? This tutorial will show you how to enableWooCommerce integration and use all the additional functions of JetAppointment.
By this time you have probably already passed the basic plugin installation. Before we start, please make sure that you have created and applied default WooCommerce pages. It is an important moment because the redirect from the appointment form to the checkout page will be created automatically.
1 Step — Enabling WooCommerce integration
Navigate to Appointments > Settings and turn the WooCommerce Integration toggle on.
Then, proceed to the Products dashboard tab and check that a new product appeared on your products list.
It is a sample product that was created automatically and you don’t need to make any changes here.
2 Step — Setting the price for the services
Please note that there is no need to set the price in the Woo product. Navigate to the services Price per slot meta field and set the price here.
3 Step — Define form Notification Settings
Now you have to make sure that you have proper notification settings in your forms. Go to JetEngine > Forms find one of the appointment forms that were created automatically and click the “Edit” button. First of all, you have to create an additional hidden field for price. Click the “Add Field” button, set the Type to “Hidden”, define Name and Label, select “Current Post Meta” in the Field Value option, and type in the Price per slot meta field name to the Meta field to get value from text area. Don’t forget to click the “Apply Changes” button.
When you are done creating an additional price field, it is time to deal with the Post-submit Actions / Notification Settings block. Hit the button with the pencil icon to start editing the Insert appointment settings section. The first five rows are filled automatically. However, you can change the values if necessary.
In WooCommerce Price field select the price field you just created.
To define how the WooCommerce order will look – click the “Set up” button near the WooCommerce order details option. Check this form and WooCommerce linking tutorial.
WooCommerce checkout fields map allows you to set the auto-filling of checkout form fields. All the data the user already typed into the form will be automatically inserted into the checkout form fields.
4 Step — Book & Pay
Now, let’s check how the process goes.
Well done! Hope you love this cool feature and it will help you to create something special.