Build an amazing appointments website
Setting up an appointment management solution on your website can be fiddly, not to mention expensive. Take the hassle out of scheduling bookings and manage them yourself – all within your WordPress site – with WPMU DEV’s Appointments+ plugin. It will save you a fortune – and it’s easy peasy to set up.
Appointments+ is perfect for any individual, business or group that needs to schedule time, such as:
It’s also packed with more than 30 custom appointment features that rival even the most sophisticated booking platforms:
In this tutorial I’m going to create an appointments website where scruffy-haired visitors can jump online to book a time to have their hair cut and styled at my salon, Curl Up and Dye.
1. Install the Appointments+ Plugin
You download Appointments+ here.
Before you start clicking buttons, you need to know what your want your appointments site to do.
Firstly, what kind of services does your business provide? Curl Up and Dye offers some of the best hair cuts going around at incredible prices.
Secondly, you need to know who is working at your business. I’ve got cool cats snipping at my salon.
Thirdly, what are your working hours? When is your staff rostered to work?
Let’s get on with the fun stuff. Go to Appointments > Settings > Services.
For each of the services you jotted down earlier, click Add New Service and enter its details. Leave the description page field set to none for now. We’ll come back to that later.
4. Service providers
Now we need to fill in the details for all my wonderful staff members. But before we can do that, we need to add each of our workers to the website, so click on Users > Add New and for each person fill in their details and click Add New User.
Once you’ve done that, go to Appointments > Settings > Service Providers.
For each of your staff members, click Add New Service Provider and enter their details like so:
Leave the bio page fields set to none for now. We’ll sort that out later.
5. Business Hours
Fill in the working hours for your business or working hours for each of your staff members.
A fantastic feature of Appointments+ is the ability to set not just your usual business hours, but the working hours for each of your staff members. You can even specify when they’re on a break. This is great for my stylist Dana who is a single mom and works three days a week.
Go to Appointments > Settings > Working Hours.
As we planned out, enter your workers’ shifts and don’t forget to give them breaks.
Click Save Working Hours when you’re done.
You can specify your workers’ days off or swapped shifts.
Sometimes your salon might close for public holidays or your workers might need to take a day off if they’ve got a vacation coming up, or they might even want to work an extra shift.
To account for Inara’s upcoming day off to meet with one of her companion clients and the Saturday she wants to work instead, click on Appointments > Settings > Exceptions.
In the drop down box select her name and under Exceptional NON working days select the date she wants off.
Save your exceptions when you’re done.
7. Time Base
Now let’s get stuck into the fiddly bits. Go to Appointments > Settings > General > Time Settings.
You can set the time in minutes for your appointments. I’m going to set mine to 60 minutes. There are also options to enter your own length of time if one of the presets doesn’t suit and block how soon and how far in advance clients can make a booking.
8. Create an Appointments Page
You will need a page on your site where clients can make their appointment. In Appointments > Settings > General > Display Settings you can automatically create an appointments page. Magic!
While you’re here, you can also select a preset color scheme for your appointments calendar so clients can see when times are available, or set your own color scheme.
9. Client Login
You may or may not want your clients to login to your site when they make an appointment, depending on your business.
I want clients to be able to drop by the website and make a booking with no fuss.
Go to Appointments > Settings > General > Accessibility Settings and select “No” under Login Required.
If you want clients to pay a deposit or full price when they make a booking, it’s not hard to set up.
Go to Appointments > Settings > General > Payment Settings and select “Yes”. I’m going to leave this setting as “No” because I don’t want to charge clients until they arrive at my salon for their haircut.
11. Email Notifications
When you have approved a client’s appointment for a buzz cut you can automatically send them a confirmation email.
Go to Appointments > Settings > General > Notifications and select “Yes” next to Send Confirmation.
There is even a further option to send reminders to forgetful clients.
When you’re done fixing your site’s settings, click on Save Settings.
There are some handy shortcodes you can use on your site to do things like list your services, list staff and list a client’s appointments.
To check out the codes, go to Appointments > Settings > Shortcodes.
13. Create Services Pages
Remember when I said earlier we would worry about the description pages for our services later? Later is now.
Create a new page for each of your services and turn this:
After you’ve created each page for your services, don’t forget to head back to Appointments > Settings > Services and select the appropriate page in each of the description page fields.
14. Create a Staff Page
Now we need to do the same for our staff.
Create a new page for each of your staff members. You can even add a photo by uploading a Featured Image.
And here’s what it will look like on your site:
Now that you’re all done setting up your appointments site, you can start taking bookings.
New appointments will appear in Appointments > Appointments.
If a client calls to book a buzz cut with Dana over the phone, you can manually add an appointment. Click Add New and fill in the details.
If you have selected to accept payments from clients when they make an appointment, they will be listed in Appointments > Transactions.
You can sit back and watch the money roll in. Any pending transactions you need to action will be listed here.
17. Google Calendar
One of the great things about Appointments+ is that admin and clients can save any appointment directly to their Google Calendar, and it’s super easy to set up.
There are two ways to go about it. When clients make an appointment on your site they can tick the Google Calendar option before they confirm their booking.
Or, if you want to fully integrate Google Calendar with your site you can enter API credentials in your settings to allow appointment edits made from Google Calendar to update on your site.
To do this, go to Appointments > Settings > Google Calendar and under Google Calendar API Settings look for instructions and click the little blue button.
I admit, when I first opened the list I felt a little overwhelmed, but if you follow each step carefully you’ll have Google Calendar integration working in no time. Rather than re-invent the wheel with a guide on how to set it up, check out this handy video:
And That’s That!
You should now have a fully functioning appointments site.
If you have any problems, go to Appointments > Settings > FAQ to find out more or turn on the helpful FAQ pop-ups.
Photo: DafneCholet via Compfight cc.
- You’re gonna love our new Appointments + plugin Manage appointments, take bookings and look after your businesses calendar…
- Build Amazing HTML Email Campaigns With WordPress Using HTML Templates with WordPress to create Mailing Lists…
- 12 Amazing Plugins that Take WordPress beyond a Website A few weeks ago I looked at some of the…