How to Add Appointment Booking Widget to WordPress Website

How to add an appointment booking widget to WordPress? If you think of a beauty salon, clinic, or any other service business that takes hourly appointments, in this guide we’ll tell you how to set appointments on autopilot on your WordPress site. The MotoPress Appointment Booking plugin for WP is going to help us in this process.

This plugin is crafted by MotoPress, a team that made its name thanks to the successful Hotel Booking plugin that powers hundreds of websites on the net and helps property owners manage their rental businesses online and receive reservations.

That means you are in good hands when it comes to booking plugins!

Appointment Booking is a premium plugin that will help you enable automatic appointments for both a small shop/institution as well as for multiple locations. The plugin is perfect for:

• Creating a database of the staff members
• Adding a list of bookable services and assigning employees to them
• Setting up flexible working schedules and service durations
• Adding a WordPress booking widget to a website
• Accepting and registering incoming bookings automatically
• Keeping all records on bookings, clients, employees and earnings in one dashboard in WordPress
• Showcasing employees, services, etc. on the site in a preferable way.

For those of you looking for a ready-made theme exclusively integrated with this WordPress scheduler plugin, check out this niche-specific collection of the WP booking themes.

In this tutorial, I’ll use the Medmix theme that is perfect for doctor scheduling sites and clinics.

So let’s take you through the steps of adding appointment booking features to your WordPress website.

Install the Appointment Booking plugin and configure the settings

First, you need to install and activate the plugin as you would normally do with any other one. It will add the Appointments menu, where all the general settings are located.

This will be your starting point. In the general settings, you can set up:

• A default time step for setting service durations, e.g. this will allow you to set different appointment durations depending on a service, e.g. set 5m if you have appointments that last 45m.
• Choose a currency to display the correct symbol next to the service price stated on the site
• Set up email notifications.

As for email notifications, you’ll be able to customize admin and client notifications, apply some brand identity and all the information you want clients to get.

For example, the location, date, and time of the appointment:

You can also send ‘cancel appointment’ emails on a client request. All in all, there are 5 types of email templates:

You can also change email styles, colors, backgrounds, etc.

Add unlimited staff members

The WordPress Appointment plugin by MotoPress makes it easy to add employee profiles and build working schedules for them.

In addition to the text bio and photo, you can include specific contact or social media information by filling in dedicated fields. The latter are most useful if you plan to feature staff profiles publicly on the site.

Otherwise, clients will only see the names when booking an appointment.

In my Medmix theme, there are also pre-made directories listing doctor profiles – they are built manually with Elementor:

But if you use the plugin with any other theme, the former will give you several ways to output the list of employees automatically, using information sourced from the plugin.

Add departments, salons, clinics, or other locations where you operate

The benefit of the WordPress reservation system we’re using is that you can employ it for a multi-chain business.

Locations can be also divided into subcategories so that you can have a department location and a clinic category. This way prospects will be able to choose a clinic and even an exact department. Or, for example, you can have city locations and clinic categories.

Schedule working hours of your staff

The plugin allows you to build a flexible working day for each employee as well as assign services to them.

To personalize a staff member timetable, you are free to designate:

• Normal working day in hours
• Lunchtime and breaks
• Optionally change a location depending on a weekday
• Add days off.

You are free to choose multiple periods for days off – and customize them at any time:

To make slight changes to the regular working day, you can add a custom working day schedule:

That’s it – the process is pretty clear and you can get to the needed menus any time.

Add services you provide

It shouldn’t also take a lot of time to add, categorize and customize services. Service categories function as search filters and ease the search process for clients.

Services are obligatory in the booking widget, but you can also output them on the page to inform clients about your offerings:

• Service price
• Duration
• Buffer times​ before and after the service to help employees prepare for the appointment
• Assign staff members to the services.

When choosing the staff members, you can also set different tiered rates (price and duration) depending on who performs the service:

Once all the settings are added, you are free to add a booking widget to your WP site.

Add a booking widget to your site

There are many shortcodes that help you easily add plugin-related content to the page. To make the process of adding them more user-friendly, the plugin offers a specific shortcode generator, which means to personalize a shortcode, you need to just click the buttons to designate your preferences.

For example, to add a shortcode that will add a booking widget, you need to create an appointment form shortcode and then simply paste it to the needed page or widget zone.

In particular for the WordPress booking widget, here is what you can do:

• Designate form filters you want to be displayed in the booking wizard (e.g. if there is just one clinic, you can simply offer clients to choose a service)
• Optionally change form labels
• Designate what default must be displayed
• Tweak CSS or HTML if needed.

Once done, click Publish to generate the shortcode:

But this is not the only way to customize the shortcode!

Since the MotoPress Appointment Booking plugin supports all popular editors, including the native WordPress block editor, Elementor and Divi, you can easily add a shortcode visually in a no matter WP template for bookings you use.

For example, let’s add an appointment booking widget in Elementor:

So here is our widget/wizard:

One the next step, clients need to choose the date and time and then confirm a booking:

On the final step, clients provide their personal details to submit a booking:

The reservation is submitted:

You can check your bookings in the Bookings menu.

The details are customizable – you can change the booking status and edit client info:

So far you can confirm bookings manually and the clients can pay after arrival or via a direct bank transfer. In the next plugin updates, the payment gateways will be released allowing you to enable clients to pay you online.

Optionally add other widgets to the site

As you might have noticed, there are a lot of widgets related to the booking plugin that you can add to the other site pages, for example, an employees list, locations list, services list, employee schedule, etc.

For example:

• Services list

• Employees profile

You may customize the default output further or use default styles from your theme.

You can go with different shortcode combinations to build the needed page, or if you’re aware with CSS, make further adjustments. From our experience, the easiest way to get a great look for your content without effort or technical knowledge is to use a WordPress theme that is optimized for the booking plugin from scratch.

Conclusion: How to add appointment booking widget to WordPress website with MotoPress?

As you see, the WordPress appointment booking plugin is optimized for really quick and easy appointments, while the plugin system remains quite flexible allowing you to make any changes as for the employee schedule, services, or the booking widget. Ready to add smooth booking features to your WordPress site?

FAQ

The post How to Add Appointment Booking Widget to WordPress Website appeared first on MotoPress.