Today, I'm going to show you how to use the Easy Appointments plugin for WordPress to create an appointment booking system. We’ll start by exploring the basic settings provided by this plugin, and later on, we’ll go through a real-world example to build a complete booking system.
Irrespective of the profession, an online appointment booking system is a must-have these days to provide comfort and flexibility to customers. Not only that, but it also improves overall resource utilization for service providers. Thus, the benefit of setting up an effective online appointment booking system is twofold: customers have a choice to book a slot which suits them, and service providers get help planning their time.
Today, we’re going to look at how to set up an appointment booking system with WordPress. If you’re using a WordPress website and you’re curious about how to build a booking system for your website, you’re in the right place!
As a WordPress developer, you have the luxury of choosing your desired plugin from a wide range of free plugins available from the WordPress plugins library. Similarly, you’ll find a lot of plugins for the booking calendar system as well. For this post, I’ve picked one of the best free plugins in the category, Easy Appointments, and I'll show you how to use it.
For this article, I’ve used WordPress 5.1, and the Easy Appointments plugin version is 2.3.12. I would recommend that you install it if you want to follow along with this article. To install the Easy Appointments plugin, just follow the standard installation process.
Next, we’ll explore the basics of the Easy Appointments plugin along with the setup process. Then, we’ll build a real-world example which will demonstrate the use of this plugin. Meanwhile, we’ll also go through a few important aspects of this plugin that allow you to customize a booking system.
What Is the Easy Appointments Plugin?
The Easy Appointments plugin is one of the best free plugins in this category. It allows you to easily set up a time management system. It can be used for almost any profession such as doctors, personal trainers, personal tutors, or anyone who wants to book appointments.
Let’s have a quick look at the features it provides:
- multiple locations
- multiple services
- multiple workers
- create time slots by providing a combination of location, service, and provider
- create a dedicated calendar for a specific service
- email notifications and related customization
- responsive layout support for the appointment booking form
- custom fields support to collect extra information
- back-end reports for timetable overview
So as you can see, this plugin can be used for a variety of services, and it may turn into an effective booking system if you use it wisely.
In the next section, we’ll discuss a couple of core elements of this plugin that are important to understand in the first place should you wish to use this plugin effectively.
Location, Services, Workers, and Connections
The Easy Appointments plugin is different from other booking plugins in that it allows you to create time slots by associating them with a specific combination of location, service, and worker.
Briefly speaking, it works like this:
- A user selects a location from the drop-down box.
- When a user chooses a specific location, they'll see all the services available for that specific location.
- Next, when a user selects a specific service, they'll get a list of all the workers available for that service and all possible time slots for the booking.
- Finally, a user just has to fill in the required information and confirm the booking!
Now, let’s quickly go through each element.
Firstly, you need to add locations in your system at which you intend to provide your services. For example, if you want to restrict your services to certain cities, you need to add cities in the back-end.
Once you’ve added locations, the next step is to add services as per your requirements. Of course, you can create different services for different locations.
Finally, after creating locations and services, it’s time to add workers who will be actually serving customers as per the bookings assigned to them.
A connection allows you to create time slots by combining a location, service and worker together. When you create a new connection, you also need to select days of the week and hours the connection is applicable to. Don’t worry if this sounds a bit confusing—it’ll make sense when we build a real-world example in the next section.
A Real-World Example of Using the Easy Appointments Plugin
In this section, we’ll build a real-world example to demonstrate how you could use the Easy Appointments plugin.
Before we proceed, make sure that you’ve installed the Easy Appointments plugin in your WordPress site if you want to follow along. Once you install the Easy Appointments plugin, it will add plugin-related links to the left sidebar.
Let’s say we want to build an appointment system for a dental clinic in New York City. In this case, New York City is considered to be a location entity. Next, we’ll add a routine dental checkup as a service. And finally, we’ll add a couple of doctors who can be booked during weekdays.
Add a Location
Firstly, we need to add all locations; in our case, we’ll add New York City as our service location. Click on the Easy Appointments > Settings > Locations link, and it should take you to the location listing page.
Click on the Add New Location button and enter details related to New York City as shown in the following screenshot.
In our example, we’ve considered only New York City, but of course you could go ahead and add as many locations as you want.
Add a Service
Next, we need to add the services that we want to provide on our booking site. In our example, we’re going to provide the Routine Dental Checkup service.
Click on the Easy Appointments > Settings > Services link, and it should take you to the service listing page. Click on the Add New Service button and enter details related to our service as shown in the following screenshot.
Fill in the Duration and Slot Step text boxes with 60, and save for now. The Duration field indicates the duration of an appointment for that service and the Slot step indicates the next available service start. We’ll get back to this later.
Add a Worker
Finally, we’ll need to add doctors that will be available for the checkup. Click on the Easy Appointments > Settings > Workers link, and it should take you to the worker listing page. Click on the Add New Worker button and enter the details for a doctor, as shown in the following screenshot.
I’ll add a few more, and you could also repeat the process to add more doctors.
Create a Connection
So far, we’ve added locations, services, and doctors. Now, it’s time to tie them all together and create a connection which can be used for booking.
Go ahead and click on the Easy Appointments > Settings > Connections link, and it should take you to the connection listing page. Click on the Add New Connection button to create a new connection, as shown in the following screenshot.
Select location, service and worker from the respective drop-downs that you want to tie together. I’ve selected New York City in the Location dropdown, the Dental Routine Checkup service in the Service dropdown and the Dr. John Smith worker in the Worker dropdown box.
Next, select which days of the week this service is available. Along with that, you can select a start time and end time for the service availability. Make sure to set the Is Working field to Yes to make this connection active, otherwise it won’t be displayed in the front-end. Once everything is filled, go ahead and save the connection.
In the next section, we’ll see how to display the booking calendar for the connection which we’ve just created.
Integrate the Booking Calendar in Your Page
Once you’ve created a connection, you need to use a shortcode to display the booking form. You can insert the following code in your post or page to display the booking form.
And with that in place, you should see the booking form, as shown in the following screenshot.
As you can see, there’s a calendar displaying all the available time slots for the connection which we created earlier. If you can recall, we selected a one-hour time slot for the service, so users will be able to select from eight different time slots in each working day. You won’t be able to book at the weekend, and those days will be greyed out.
Once a user selects a time slot, they'll be taken to the Booking Overview section. They can enter their details to confirm the booking.
On the back-end, you’ll be able to see all the bookings that were made for all connections. Also, email notifications are sent once the booking is made. If the booking is not available for any slot, it’ll be displayed as shown in the following screenshot.
As you can see, the booked slots are grayed out and won’t be clickable.
So that’s how you can set up an appointment booking system using this plugin. Additional plugins are available to extend the default functionality and integrate with services like PayPal, Twilio, iCalendar, and Google Calendar.
If you use this extension wisely, it will allow you to build an amazing booking system.
Today, we discussed the Easy Appointments plugin, which allows you to easily build an appointment booking system. In the first part, I explained the basic concepts of the plugin, and later on we created a real-world example for demonstration purposes.
I would love to hear from you if you’ve come across other good calendar or booking plugins! Feel free to share your thoughts and feedback using the feed below.
Subscribe below and we’ll send you a weekly email summary of all new Code tutorials. Never miss out on learning about the next big thing.Update me weekly
Envato Tuts+ tutorials are translated into other languages by our community members—you can be involved too!Translate this post