How to Use Booking with WooCommerce
The tutorial explains how to expand the WooCommerce functionality using the Jet Booking plugin to apply seasonal/weekly prices, rates, sailing dates, additional products, manage orders via the JetBooking dashboard, and more.
Before you start check tutorial requirements:
- Elementor (Free version) or Block Editor (Gutenberg)
- WooCommerce plugin installed and activated
- JetEngine plugin installed and activated
- JetThemeCore plugin installed and activated
- JetBooking plugin installed and activated
Booking Settings
Navigate to WP Dashboard > Bookings > Bookings > Settings. Unroll the Booking mode drop-down menu of the General tab and select the WooCommerce based mode.
The Booking hold time drop-down menu allows specifying the time for payment (here, 5 min).
After selecting, the link to Create your first product will be displayed. Click this link or navigate to the Products > Add New tab.
Adding New Products
Clicking the link leads to the New Product page with the preselected JetBooking product option from the Product data drop-down menu; in contrast, the Products > Add New tab redirection displays the default settings; therefore, users have to select the JetBooking product option from the Product data drop-down menu.
This option turns on additional fields such as Pricing Settings (i.e., rates, seasonal/weekly prices), Custom Schedule, etc. These settings are globally configured on the booking settings page (Booking > Settings tab), but the settings configured on the Single Product are a priority.
Create a new product with the necessary data (i.e., seasonal prices, ratings, starting dates, offset dates, min/max days, custom schedules, etc.).
Press the “Publish” button to publish the product.
Product Page Functionality
Press the permalink of the product for redirection to the product page.
The front-end view of the product page displays native fields of the Woocommerce product page, such as regular price.
After selecting the booking dates and pressing the “Book Now” button, the product will be added to the user’s card and available for the time set at the Booking hold time drop-down menu of the General settings.
If necessary, add other units to the cart.
Press the “View Cart” button to be redirected to the checkout page.
Press the “Proceed to checkout” button to place the order. The checkout process does not differ from the checkout for regular WooCommerce products, and the order is collected as a regular WooCommerce order.
Booking and Order Managing
Navigate to WP Dashboard > Booking > Booking tab. This tab displays all orders.
Besides, the WP Dashboard > WooCommerce > Orders tab to see all orders.
Press the appropriate order to see its details or apply necessary actions.
If users edit the order via the Booking dashboard (i.e., change its status), the Order list by the WooCommerce plugin will display these changes in the Order details.
WooCommerce Product Page Customization
Navigate to the Crocoblock > ThemeBuilder tab and create a new template for WooCommerce products.
Use the JetWooBuilder, JetThemeCore, and JetProductGallery plugins to make the product page more user-friendly and apply appropriate widgets.
That’s all about expanding the WooCommerce functionality with the JetBooking plugin.