Reading list Switch to dark mode

    Booking App by Webkul for Shopify

    Updated 26 September 2023

    If you are eagerly waiting to offer booking services to the customers, your wait is over now. Here, we are presenting a new app namely Booking App for Shopify.

    With this app, you can now add bookings to your Shopify store products and have a simple yet powerful booking system for Shopify. Thus, the customers will book or rent the products & can schedule their appointments from your store simply by choosing their preferable slots, date, and timezone.

    There can be distinctive booking scenarios if it comes to have an online booking business. Undoubtedly, you will always go with the one that perfectly suits your booking business needs.

    Thus, our booking app will help you to create multiple bookings for any type of booking cases whether it will be appointment Type Bookings (Time slot bookings) or Concert Type Booking (Day-wise booking), Rent Type bookings or One Day bookings.

    Before proceeding to understand each booking in detail, let’s take a look at some of the outstanding features of the Booking App.  

    Searching for a Shopify
    Headless solution ?
    Find out More

    Additional Features of Booking App

    • An interactive dashboard to track the ongoing progress of your online store.
    • Get notifications for all the actions performed in the app.
    • View complete booking details of your customers. 
    • Option to choose a booking type & add bookings to your store as per your business need.

    Booking Types

    Once Day Booking to offer one day cab booking service, etc.
    Appointment Type to create an appointment scheduling system. Explore!
    Rent Type to offer rental bookings. Explore!
    Concert Type to offer day-wise bookings for live concert, event bookings, etc. Explore!

    • Add custom fields to your booking product in case, you want your customers to provide their additional information at the time of booking.
    • Manage customer’s cancel, reschedule booking requests.
      -Get the option to approve or deny requests from the app.
    • An informative calendar view for all the bookings. 
      Google Calendar feature to add customer’s booking events to Google Calendar.
    • Manual Booking Option to create bookings on behalf of your customers. Explore!
    • Overwrite specific days feature

    Close bookings for some specific days or time duration, in case you are not available to receive customer’s bookings. Explore!

    You can overwrite days in bulk also. Just select the booking products for which you want to overwrite days & perform the action in just a single step. Explore!

    • Set Minimum Guest Limit per Customer in case of multi-user booking.
    • Auto-approve customer’s reschedule booking request.

    Integrated with Multi-vendor Marketplace for Shopify. Explore!

    • The customer can request the admin to reschedule his booking.
    • Moreover, Customers can view booking details from their respective “My Account” section.

    Booking Product Listing

    Have a separate page to list all the bookings products/services listed on your store.

    • A separate section to list all your customers who schedule appointments & make bookings from your store.
    • Customers can easily filter any booking type by days/week/year/month and also by date range.
    • In Rent Type bookings, you can allow customers to choose the group days to rent a product. Thus, restrict them to rent an item for a fixed number of days. Explore!
    • Update booking type for the products/services that are not yet booked by the customers.
    • In the “Rent Type” or “Rent Type with time” bookings, the multi-user booking type is for unlimited guest users.
    • You can select all variants and add them as booking products at a time.
    • You can now lock the booking products/services in the customer’s shopping cart. Just enable the settings from the Booking Configuration menu of the app. Explore
    • The app is now available with Shopify Point of Sale (POS). Explore
    • You can restrict booking product features for your sellers in case you are using the Booking App with the Multi-vendor Marketplace app. Explore
    • The app has now become Partner Friendly!
      You can now add the Booking App to your development store with 15 days Free Trial. So, even if you haven’t opted for any Shopify paid plan & you are in the app’s free trial, you can install the app to your development store.
    • Configure booking dashboard labels on the seller end (Multi-vendor-Booking App Integration).
    • Global Booking: Let customers create bookings from a separate Global Booking page. Explore

    How to Install the Booking App

    In order to install the Booking App to your store, all you need to do is just visit the Shopify app store and get the Booking App by Webkul.

    Now, follow the below-given instructions:

    • Click the Add app button of the Booking App by Webkul page of the Shopify app store.
    • Clicking the add app button, you will be asked to enter your Shopify store URL. Enter your store URL & click the Login button.
    • Once you click the login button, you will be straightaway redirected to your Shopify store.
    • Click the Install button to install the app to your Shopify store.
    • Once installed, you can see the booking app in the Apps section of your Shopify store.
    1-4

    That’s how you can install the booking app to your store effortlessly.

    Admin’s Dashboard: Track your Progress

    In this Booking App, you will have an interactive dashboard that represents your booking statistics, your earnings, your account information as well as all the notifications that you get from the customers.

    2-4

    You can schedule booking from the app in case you need our support in adding the codes or configuration.

    Moreover, you can view all the six different types of bookings in the app from here:-

    3-3

    How to create booking Products

    Admin needs to follow the below-given steps to add bookings to Products:

    • Go to the Booking App by Webkul.
    • Visit Booking Product Section.
    screenshot_1688452435719
    • Click the “Add Booking Product” button.
    • Select Your Store Product to which you want to add a booking.
    • Now, Choose the Product Variant. You can add the booking to a single variant or all variants.
    • Clicking the Proceed button, You will be straightaway redirected to the “Edit Booking Product” section.

    There, you need to fill in the following details:

    Product Information:

    In this menu, you need to choose the booking type i.e. Single User Booking or Multi-user Booking.

    Thus, you need to select if you want only one customer to book a slot at a time or if you want to offer the same time or date slot to multiple customers.

    Multi-User Booking

    Customer’s Guest Limit: You can set a guest limit for the customers to book a slot.

    Let’s understand it with an instance: Suppose it sets to 20 then, a single slot will be available for a maximum of 20 guests.

    Maximum Guest Limit per Customer: You can set a maximum guest limit for each customer to book a slot at a time.

    Let’s take an example:- Suppose it sets to 10 then, an individual customer can book a single slot for a maximum of 10 guests at once.

    Minimum Guest Limit per Customer: You can set a minimum guest limit for each customer to book a slot at a time.

    Let’s take an example:- Suppose it sets to 5 then, an individual customer can book a single slot for a minimum of 5 guests at once.

    Location:

    Set location preferences i.e. if You want to provide the service to the customer’s location or at Your own preferred location.

    Availability:

    From this section, the admin can choose the booking type as per his/her business needs whether it will be an Appointment Type booking, Concert type, or Rent Type booking, and create the slots accordingly.

    4-3

    Overwrite Specific Days:

    In this feature, you as an admin can close booking for some specific days or time period of any of his created slots. All You need to do is just create slots on some specific days or time duration that will overwrite the previous slots created for the booking product. Know More

    Schedule Updation
    In the appointment type bookings, you can now update the time slots on specific dates in case you are not available to provide services on the previously created slots. These newly updated slots will overwrite the previous slots created for the booking product.

    5-2

    Custom Fields:

    In case you want some additional information from your customer, you can add custom fields with the booking products from this section.

    Custom Information:

    From this section, You can display extra information about the Product or Service You provide on the store’s product description page.

    Alternative: To Add Booking to the Product

    Admin can create a booking product from the Product section of the store.

    Now once you install the app on your store, you can select any product (or add a new product), choose its variant, select the Booking Type (Appointment/Concert Type), and assign it as a booking product.

    6-3

    All you need to do is to click on the “More Action” menu of the selected product and click the “Booking Product” button.

    7-4

    Once you click the “Booking Product” button, you need to select the variant of that product which you want to assign as a “Booking Product”.

    Now, you can select the “Booking Type” whether you want to create Appointment Type Booking (Time-wise Booking), Concert Type Booking (Day-wise Booking) or Rent Type booking and proceed further.

    8-3

    Once you click on the “Proceed” button, you will be reaching to the “Edit booking product” section of the booking app.

    There, you can view the booking product information and option to choose a single or multi-user booking type.

    Now, specify the preferred location where you want to provide the service to the customers and select the booking type from the “Availability” section.

    9-3

    Moreover, you can add Overwrite some specific days i.e close booking for some specific days, add custom fields and additional information for your booking product.

    Edit Booking product product Info

    It is as simple as this:

    The admin panel of the Shopify store>>Visit the “Product” Section>>Select any product (or add a new Product and “Save” it)>>Click “More Action”>> Click “Booking Product“>>Fill the booking information>>”Save” the details.

    Booking Products

    On the admin end, this section of the booking app is having a list of booking products. Now once you create any booking product, you can manage all the related details from this section.

    screenshot_1688454282380

    You just need to select a product from this section and click on “Edit Booking Product” in the action menu.

    You can edit all the booking product details in this section. Also, you can delete/remove the booking product from here.

    Let’s understand it one by one.

    1. Product Information

    You can view all the booking product details in this section such as title, description, product image, and slot price.

    11-3

    Also, you can select the booking type as “Single user booking” or “Multi-user booking“.

    add booking type

    2.  Location

    In this section, the admin can choose whether he wants to provide the product booking service at any specific location selected by him or he chooses the customer’s preferred location for the same.

    Now, if the admin chooses his own preferred location, he needs to enter the location (the address where he wants his customer to visit).

    12-3

    3. Availability

    In this section, you can choose booking types and create the slots for your booking products.

    Here, you can set the dates between which your bookings will be available and also select the days on which booking products will be available.

    Let’s discuss the six different types of bookings in detail.

    One Day Booking

    If you want to offer any service for a day, you can choose this booking type. Thus, customers will select the slot and book the service for a day.

    Now, Let’s take an example: One Day Cab booking service: You as an admin can set a duration and the customers will select a slot to book for a day.

    one day booking

    Appointment Type

    If you want to offer an appointment booking service then, select this booking type to create time slots in basic as well as advance slot management.

    It allows you to select the time duration between which the booking product will be available. Also, you can set the Per booking timings as well as the rest time after each booking slot.

    Appointment type

    Per Booking Timings: It is the time taken for each booking slot.

    Rest Time after per Booking Slot: It is the rest time available after each booking slot.

    per booking slot

    For Example:- Dentist Booking System, Doctor’s Appointment.

    Rent Type

    If You own rental business then, go with Rent Type of booking. You can set a duration for Your service and customers will select the slots to rent the product or service.

    Important Note:- While adding rent type booking to any product, please make sure that the inventory policy of that product is “Don’t track inventory” from Shopify end.

    Rent Type

    Restrict Customers to Rent for a Fixed No of Days

    Now, you can allow customers to select group days as you can restrict customers to rent products for a fixed number of days.

    Once selected, enter the Minimum No of Days for which you want customers to select a continuous date in the calendar to rent the product.
    Enter the Maximum No of Days for which you want customers to select a continuous date in the calendar to rent the product. For unlimited days enter the maximum days as ‘0’ and the slot price will be calculated on the basis of the highest group day rule.

    Example- Suppose you want to restrict the customers to book a minimum of 3 days and a maximum of 8 days, then enter 3 in the minimum no of days and 8 in the maximum number of days.

    GROUP DAYS RULES- You can set multiple rules for slot pricing between the minimum and maximum days. Suppose the minimum number of days is 3 and the maximum number of days is 8, then you can create rules like ‘3-5 = 1 unit’, and ‘6-8 = 2 units’, so if a customer books a slot for 3 to 5 days, the slot price will be calculated on the basis of 1 quantity, and for 6 to 8 days, it will be based on 2 quantities.

    Shivangi-store-·-Booking-App-by-Webkul-·-Shopify-3

    Thus, customers will select a date and if it is set to 3 then, automatically 3 continuous days will be selected and the product will be rented for 3 days. Accordingly, the price will be calculated. Refer the screenshot:-

    Bike on Rent

    Rent Type with Time

    To offer rental service for some specific date and time, you can go with this booking type. In this, you need to set duration and per booking timing i.e the time to be taken for each booking slot.

    For Example:- Rent a bike, Rent a Dress

    Important Note:- While adding “rent type with time” booking to any product, please make sure that the inventory policy of that product is set to “Don’t track inventory” from Shopify end.

    Rent Type with Time

    NOTE:- While adding “Rent Type” or “Rent type with time” bookings to any product please make sure that the inventory policy of that product is set to “Don’t track inventory” on the Shopify end.

    Security Deposit

    Now, you can add a security deposit amount for your Rent type and Rent type with time products. To learn more about this feature visit security-deposit

    Concert Type

    In this type of booking, You can create day-wise slots irrespective of the time and let your customers book the slot. Click here to know more about how to add the day-wise booking to products.

    For Example:- Auditorium booking, Booking Halls for Seminar.

    concert type

    Concert Type with Time

    Additionally, you can create date time slots for your bookings and let the customers book their preferred slots with date & time.

    For Example:- Ticket booking for Live Musical Concerts, etc.

    Concert Type with time

    Also, you will also get an option to add day-wise booking on products simply by choosing Concert Type booking.

    Click Here to know about Day-wise booking in detail.

    4. Overwrite Specific Days

    Have more flexibility to add bookings to your store with this feature!

    Close Booking

    You can now close bookings for the customers on some specific days or time duration that will overwrite the previous slots created for any booking product.

    NOTE:- You can now close bookings for some specific time duration of a particular date in the appointment type as well as rent type with time bookings.

    You can select a date range and add the time slots to close bookings on the selected date.

    Let’s understand it with an example:
    Suppose you select a duration from 24th-28th December (5 Days) to close the booking on a product. For that, you add the time duration from 8 A.M- 9 A.M and from 10 A.M – 11 A.M.
    So, in this case, the booking on that product gets closed from 8 A.M to 9 A.M and from 10 A.M to 11 A.M on all the 5 Days (24th December to 28th December).

    14-1

    Schedule Updation

    In the appointment type bookings, you can now update the time slots on specific dates in case you are not available to provide services on the previously created slots. This newly updated slots will overwrite the previous slots created for the booking product.

    15-1

    Bulk Actions-

    Overwrite Specific Days

    We have come up with the feature of bulk overwrite specific days. So, from now onwards, you can select multiple booking products at a time and create different slots for the selected booking products on specific days. This will overwrite the previous slots created for the booking product these days.

    Select the products & click the “Overwrite Specific Days” button on the top. After that, select the overwrite type either “Duration” or “Particular Date” and create slots to close bookings.

    NOTE- This will not work in case of concert-type booking.

    Remove Overwrite Specific Days-

    Now, you can delete the previously added overwrite slots on specific days for your booking products. You need to select the previously added slots & click on Remove.

    screenshot_1691586760868
    screenshot_1691586805803

    Add Availability

    Now, you can add availability to the products in bulk for those that do not have any booking type & slots setup earlier.

    screenshot_1691587728014

    Add Custom Field

    Now, you can add the same custom fields in bulk for the booking products.

    screenshot_1691587891678
    screenshot_1691587932893

    Also, if you have already created custom fields then in this case, if you are adding a custom field with the same name it will not add again, it will be updated. If you have previously created a custom field with textarea & then want to change it to an option then you just need to click on proceed & it will be updated.

    screenshot_1691588235221

    5. Custom Information

    If you want to add some additional information about your booking product, you can add it to this section only.  You just need to enter the title of the information that you are providing along with its description. You can also delete or edit the existing custom information.

    Shivangi-store-·-Booking-App-by-Webkul-·-Shopify

    Also, the customer can view this booking product information on the product description page.

    6. Custom Fields

    If you want to get more information about your customer who is booking your product, you can add custom fields for the same. The customer needs to fill in all these details at the time of product booking. You can also delete or edit the existing custom fields.

    Shivangi-store-·-Booking-App-by-Webkul-·-Shopify-1

    Note:–  You can also make any custom field mandatory for the customers to fill that detail while booking any product.

    Bookings

    This section lists all the customer’s bookings. Also, you will get the cancel or reschedule requests of your customers.

    20

    Once you click on the three dots in the action menu, you will get an option to edit your booking products.

    Also, you can click on the “Edit Booking” button to view all the booking details and approve, cancel, or reschedule bookings as per the requirement.

    edit booking

    From this section, you can click the “Approve” button to approve the customer’s booking request.

    If the customer requests for booking, you will get notified for the same. You will receive an email after which you can approve the customer’s request from this section.

    In Case Customer requested to Reschedule Bookings:

    Clicking the reschedule button, You can enter the date and slot to which you want to reschedule Your customer’s bookings.

    Reschedule bookings

    To cancel the customer’s bookings, just click the Cancel button and Proceed. The customer will get notified of the same.

    cancel customer bookings

    Reschedules

    From this section of the app, the admin can view & manage all the rescheduled bookings. You can approve, cancel or reschedule it again.

    screenshot_1688455175857

    Booking Calendar

    You can have a calendar view of your bookings. Here, you can filter any product to make it visible in the calendar shown in this section.

    Calendar View for Bookings

    Also, you can filter it by month, week or day to view the booking product on a calendar. You will get an option of a list view as well.

    booking calendar

    Users

    There are some services that are dependent on a particular person. For example, in a salon appointment, they have multiple services like Hair Spa and Hair cut, Facial, Nail treatments etc. One person cannot provide all these services to different customers at a time. So in order to manage this, we have Users feature. You can add different users in the app & can assign these users while creating a booking product so that a slot already booked will not be available for others.

    From here you can add new users, view all the previously created users, edit/delete any existing user.

    screenshot_1688457884313

    Customers

    You can have a separate section to list all your customers who schedule appointments & make bookings from your store. You can view the customer’s name, email address, and no of bookings done by the customer.

    screenshot_1688458128843

    Add-On

    We have 4 Add-ons available in our booking app- Google Meet, Chatwhizz, ICS file download & Google Calendar.

    Let’s have a look at all these add-ons in detail.

    GOOGLE MEET

    You can send the merchant to send the automated meeting links when merchants confirm the consumers appointment. Explore!

    CHATWHIZZ

    You can enable the live conference feature on your booking website & let users communicate over the chat system regarding their bookings. Explore!

    GOOGLE CALENDAR

    You can have the Google Calendar feature in the app to add customer’s booking events to Google Calendar. Explore!

    ICS FILE DOWNLOAD

    You can activate the ICS File Download add-on in the app to directly import booking events on your calendar or share information with others directly over email using ICS File.

    With ICS File download, the admin can provide downloadable files to the customers. Thus, they can import the file on Google Calendar and remain updated with their upcoming booking events.

    21

    Subscription

    This section of the app, show your app subscription plan. You can also change the plan.

    screenshot_1688459491343

    How to Configure the Booking Details

    The configuration of the booking details includes six sections. There, you can configure your general details, booking details, email templates, booking widget, front labels as well as colors.

    Make it clear with the screenshots below.

    1 General Configuration

    screenshot_1688468725807

    You can configure your general details from here.

    Also, you can select the default “Timezone” as well as “Currency” in this section.

    SMTP Configuration

    You can have your own email in the “from” and “reply-to” section of the email sent. Refer to the user guide for the same.

    3. Booking Configuration

    You can configure all your product booking details in this section such as:-

    • Allow customers to enter the no of days after which you want to make the slots available for the customers.
    • Auto-approve customer booking requests once a new request is raised.
    • Let the customer request you to cancel his/her bookings.
    • Auto-approve reschedule booking requests raised by the customers.
    • Allow customers to create bookings even if the slot’s availability is less than the minimum guest limit set by the admin (in case of Multi-user booking). 
    screenshot_1688468832382

    4 Availability Config.

    You can set the blackout days for the rent type booking. You can set the days when to cut off the dates while accepting rental bookings. Those cut-off dates will not be available in the booking calendar for customers to rent items. Explore!

    screenshot_1688469128356

    5 Email Templates

    Admin can configure all the reminder emails/notifications send to the customers while booking any product.

    Email Template

    6 Booking Widget

    In this section, you will get an option to enable or disable the “Timezone” selector button which is visible to the customer at the time of booking any product, you can change the time format of the widget, and widget layout.

    screenshot_1688469175639

    Now once you enable this feature, customer needs to select the “Timezone” before booking any product.

    7 Front Labels

    You can configure all the labels on your own to make them visible on the front end exactly the way you want them to appear.

    26

    Configure Seller Booking Dashboard Labels

    In case you are using the Booking app with Multi-vendor Marketplace, You can configure the labels of the seller’s booking dashboard. To make the changes, you need to visit the Booking App>>Go to Configurations>>Front Labels>>Select Seller Side labels>>Change the labels>>Save.

    27

    In this way, the admin can configure the backend.

    How to Configure the Store Front?

    In order to visualize the effect of this booking app on your store, you just need to configure its frontend by copying the code and paste it to their respective files.

    screencapture-webkul-booking-app-demo-myshopify-admin-apps-booking-app-by-webkul-booking-management-web-en-app-2019-04-26-19_45_44
    1. For Booking Widget

    Now to display the “Timezone Selector” button on the frontend, just copy the given code and paste it below the product-template.liquid file.

            {% if product.tags contains "wk_booking" %}
            {% include 'bc-widget' %}
            {% endif %}

    2. For Customer’s Booking Details

    Now, to display customer’s booking detail options on the frontend, just copy the given code and paste it below the customers/order.liquid

    {% if line_item.properties.wk_booking %}
            <p><u><a href="https://{{ shop.domain }}/pages/booking-information/{{ line_item.id }}?handle={{ line_item.variant_id }}">View Booking Details</a></u></p>
            {% endif %}

    Code Pasting for Online Store 2.0

    If you are using Online store 2.0 (Example- Dawn), you need to follow the steps to add the codes.

    To show booking products on the product description page, add the below code into main-product.liquid template file:

    {% if product.tags contains "wk_booking" %}
    {% include 'bc-widget' %}
    {% endif %}
    Screenshot-2021-08-25T135133.186

    To show booking details on the customer’s “My Account” page, add the codes into customers/order.liquid template file:

    {% if line_item.properties.wk_booking or line_item.properties.slot_date or line_item.properties._Booking_slot_date %}
    <p><u><a href="https://{{ shop.domain }}/pages/booking-information/{{ line_item.id }}?handle={{ line_item.variant_id }}">View Booking Details</a></u></p>
    {% endif %}
    Screenshot-2021-08-25T135232.615

    In this way, you can configure your front end in the booking app.

    How to Cancel Bookings?

    In the Booking App, you can allow customers to cancel the bookings from their respective “My Account” section. You can configure the settings in the app.

    Go to App>>Configuration>>Booking>>Enable “Allow Booking Cancellation option to customer“>>Save.

    29

    Thus, the customers will get the option to cancel bookings on their end if the booking is not yet approved by the admin.

    As soon as the customer places an order, he/she can log in to the “My Account” section & view the order details to check the bookings.

    Customer Account

    Clicking the order ID, click the “View Booking Details“.

    view booking details

    From here, the customer can check the complete booking details & get the option to cancel the booking.

    Booking-Information-–-Demo-Store

    Clicking the Cancel Booking button, a pop-up appears asking you to confirm the cancellation.

    confirm cancellation

    This way, the customer can cancel a booking.

    booking canceled

    As soon as the customer cancels a booking, the same will get reflected at the Bookings section of the app. You can check it from the app.

    30

    Allow Customers to Reschedule Bookings

    Customers will get the option to reschedule his/her booking from the “My Account” section until the booking is not approved by the admin.

    Booking reschedule

    CASE 1: In case the auto-approve reschedule option is enabled.

    reschedule request

    CASE 2: In case, the auto-approve reschedule option is disabled.

    Screenshot-80-1

    Once the customer requests the admin to reschedule his/her booking, all the requests will be listed in the “Reschedule Requests” section of the app. From there, the admin will approve the reschedule requests of the customers, if the status is Pending!

    31

    Demo

    CLICK HERE TO CHECK THE BOOKING APP DEMO

    Demo Store URL: https://booking-app-demo-store.myshopify.com/
    Store Front Password: peucli

    RECENT UPDATES

    Click here to Check the Recent Updates!

    Need Help?

    Hope you like this blog! To get more interesting blogs, keep in touch with us. If you need any kind of support, just raise a ticket at https://webkul.uvdesk.com/en/. 

    Also, you can contact [email protected] to get proper assistance.

    Thank You for reading this Blog!

    . . .

    Leave a Comment

    Your email address will not be published. Required fields are marked*


    Be the first to comment.

    Back to Top

    Message Sent!

    If you have more details or questions, you can reply to the received confirmation email.

    Back to Home

    Table of Content