booking_widget_1280x720.mp4

00:00:00

In this tutorial, I'm going to be teaching you how to use the bookings widget

00:00:03

The bookings widget can be used to create a calendar from which you can set appointments or reservations

00:00:11

And it's very easy to set up

00:00:13

Simply add the widget to the page you wish the calendar to appear

00:00:17

Now, when you create a bookings widget, it's going to have you create different event types

00:00:24

Now, these events can be used to organize the different reservations or calendars and each event is separate

00:00:30

So you can use these for different people or different locations

00:00:36

However, you want to set that

00:00:38

So simply create an event in order to set it up

00:00:42

You would give the event a name such as what the event is or what the calendar will be called

00:00:48

For this one, we're going to call it initial contact

00:00:53

But you can name it whatever you'd like

00:00:55

The description above the calendar

00:00:57

This is where the text that will be shown above the calendar and this should just be a quick note about the event itself

00:01:03

And the description in the booking pop -up is what's going to say in the modal that pops up once you actually select a date

00:01:13

And you would use this to give instructions or additional info

00:01:17

Now, the contact email, this is where the actual reservation is going to go after a reservation or bookings is set

00:01:31

So you would enter your email address here and that's where you'll receive the information

00:01:37

Now, the time zone right here, this can be a bit tricky because it really depends on how you want to set up your time and reservations

00:01:46

Now, if you're doing an online or digital event, it might be wise to figure out your local time in the UTC time zone and keep it at UTC because that's pretty universal

00:01:58

And it's often useful for people with digital events around the world

00:02:01

However, if you have an actual physical location or you're in a specific time zone, you're going to want to actually set that time zone so that the calendar is local to that specific location

00:02:13

So, like I said, if you're doing something online, it's probably wise to use UTC

00:02:19

However, if you're doing something physical, then just go ahead and set your local time zone

00:02:24

Now, the date and time format is simply used to determine how the formatting will be shown, whether you want it month, day, year or day, month, year

00:02:33

It's very simple

00:02:34

And you can set a picture right here and that'll appear above the calendar as well

00:02:41

So, let's go ahead and select a simple image

00:02:44

It's perfect for the initial contact

00:02:48

And now you can see, once we set that and everything saved, it has set up our calendar right here

00:02:56

There's our picture, there's our initial title

00:02:59

Now, the event duration will determine how long the meeting is

00:03:04

So, if you only have 30 -minute meetings, it'll block off and allow you to select 30 -minute sections

00:03:10

And you can also set a buffer that'll follow between the end of a meeting and the start of the following one

00:03:17

So, if your meeting is 30 minutes long, but you want to have a five -minute break in between each one, it'll add an extra five -minute padding in between each meeting

00:03:29

Now, the available seats is the amount of reservations that can be booked within the same time zone

00:03:38

So, essentially, the amount of seats, whether it's physical or virtual, that are able to be within the same block

00:03:46

So, if you only have one seat available, then that means only one person can actually get into that specific time zone within that date

00:03:54

Otherwise, if you have two or more, then multiple people would be able to join that same time zone before it would block it off for future reservations

00:04:02

Now, the hours in advance, this is the minimum hours in which a person can book an appointment

00:04:09

So, if you want them to have to book an entire day in advance, you can leave it at 24 hours

00:04:14

But if you want people to come in, to be able to come in within the hour before the meeting starts, you can set it to an hour and they will be able to book within that

00:04:24

hour

00:04:25

And the rolling days, this is the amount of future days by which an appointment can be scheduled after you set the availability, which will go over next

00:04:34

So, once you set your availability, you would set the rolling days, which is the amount of days those availability would carry over

00:04:41

So, if you leave it at seven days, then only seven days into the future, people will be able to book

00:04:46

Otherwise, you can set it to 30 days and people will be able to book up to a month in advance

00:04:51

And this block multiple bookings, this is important to block the same person from booking multiple slots within a day or per timeframe or overall

00:05:04

So, what I would recommend is that while you're setting up this calendar and booking legit, set this to know that way you yourself can actually test it easily and set multiple appointments and bookings without getting

00:05:16

blocked

00:05:17

Otherwise, if you leave this to yes, it will block you and then you'll have to reset the calendar essentially in order to reactivate it

00:05:24

So, set that to know why you're testing, once you're fully set and tested, you can set this to yes so that people cannot book multiple times within the same period

00:05:34

After you've set all this, you would go ahead and simply set your availability and your questions

00:05:40

Availabilities are the times in which you are actually available in which a person can book an appointment on the calendar

00:05:47

So, you would set your availability for each day that you would like a person to be able to book

00:05:53

Let's say that we own a business and it's open 9 a m

00:05:56

to 9 p m

00:05:58

Monday through Friday

00:05:58

So, we would simply add those dates to each day

00:06:01

You can enter the time in either a 24 -hour format like so or by actually entering 9 a m

00:06:09

and 9 p m

00:06:10

which I find a bit easier

00:06:13

So, simply add your times to each date that you're available and then that'll add those days to the calendar

00:06:23

But let's say that we are going to be unavailable on a specific day

00:06:27

You can actually set specific day unavailabilities or availability using this button

00:06:34

So, let's say that we're not going to be available on the 15th, which is a Friday where we normally would be

00:06:41

We can make this whole day unavailable or we can set a time zone by which we are available or unavailable

00:06:47

And once we save that, it'll then allow all those dates availability except for that specific one

00:06:56

And you can see when we scroll down

00:06:58

Now, all Monday through Friday are now available to book except for the 15th

00:07:03

And that's how you add availability

00:07:05

Once you've added availability, you're going to want to now add the questions

00:07:10

that will happen after a booking action

00:07:12

So, once somebody selects an actual date and time, this will determine the questions

00:07:16

that they have to fill out in order to complete the booking appointment

00:07:21

So, this is where you would add these fields here

00:07:24

Lots of different types of fields, lots of different types of field types

00:07:28

I would recommend experimenting with these and seeing exactly how they work each one because they all act a little bit differently

00:07:35

For this one, let's just say we want their email address

00:07:39

So, we would select email field, give this a label, the help text describes what they would do so we can put enter email here

00:07:50

Now, the placeholder, this is going to be the gray text that's within the actual text box itself

00:07:56

Kind of like you can see this HTTPS down here, how it's gray, that's a placeholder

00:08:00

And I'll type placeholders so you can see how that looks

00:08:04

Now, mandatory will determine whether they have to fill this out in order to actually proceed

00:08:08

So, we want this yes

00:08:10

And now, once we save this, it'll now add that question

00:08:13

to the booking widget once they try to select a date

00:08:17

And you can also add an after booking URL

00:08:24

So, after they booked, you can have them show an actual URL that they would be able to click and that would take them to like a thank you page or a different website

00:08:33

Or maybe a video, however you want to do that

00:08:35

And you can also name the button text here

00:08:38

Now, after you have set up everything with your details, your availability, your questions

00:08:46

and your bookings

00:08:47

If you have an email field within the questions,

00:08:51

you can actually set up the auto responder so that it will reply back to their email

00:08:56

Please watch the auto responder tutorial to understand how that works

00:09:00

So, now we've saved everything

00:09:03

Let's go ahead and see what this would look like from the customer's perspective

00:09:06

You can see when they go to our website, they have the picture right there

00:09:10

There's the name of the actual event and access a title as well

00:09:15

And then there's our dates and availability

00:09:18

You can see we've actually set up to 30 days out in advance

00:09:21

And they can select a date

00:09:23

Once they select one, they'll be presented with the times

00:09:26

Because we added 30 -minute meetings with a 5 -minute buffer on each one, it allows them to select 35 -minute time blocks

00:09:34

So, we would simply select a time we'd like

00:09:37

And then you see the questions

00:09:38

we entered right here

00:09:39

There's the email that's asking

00:09:41

There's the help text telling them to enter the email

00:09:43

There's a placeholder that we'd entered

00:09:45

And if we set up our auto responder, once we set this booking request,

00:09:51

they would get in a reply from their email

00:09:55

And we're also going to get a reply to the email we set for the initial details

00:10:01

Once they've set their booking reservation, they can then download that as an iCal file, which works with Apple products

00:10:08

Or you can download it to the Google Calendar

00:10:11

And then they'll also receive an email

00:10:13

Like I said, if you've set up the auto responder, you'll receive an email to your contact email automatically

00:10:19

And then that's how easy it is to set up the booking widget