The Booked Calendar widget is a smart tool that notes down the important date you mark for it. Here, your visitors can fix an appointment time that you have made using this widget. It’s handy and easy to use.
To use this easy-to-use widget effectively, you need to know how it works. Let me give you a complete guide to it!
Installing Booked Calendar Widget
Go to WordPress Dashboard> Element Pack> 3rd Party Widgets
There, you can see the Elementor Booked Calendar widget in the list. Click on the download button on the box and it will automatically install the widget.
To Insert Widget
Inserting the widget is just a matter of drag and drop. However, click and hold on the widget icon from the menu and drag the calendar widget to the drop point. Follow the picture above.
Content Tab
Using the Content tab, you can basically make a layout of a particular part of the website.
Layout
Go to Content Tab> Layout
From the first section Layout, you can change the date, calendar size, and layout of the calendar. There is a switcher, turning it on will make the calendar accessible by members only. The layout is set to Default.
When you change the layout to List, the booked calendar will look like this.
Moreover, if you change the booked calendar widget size to Small for the List layout, the appointment buttons will appear as full-width.
Note that, the Default layout and the List layout both have a different set of sections in the Style Tab.
Style Tab (Default Layout)
Now, time for some Style. In this Style tab, you will have more options to create your unique Booked Calendar widget as you like. Let’s have a look.
Header
Go to Style Tab> Header
You can change the color of the header section and border.
Date
Go to Style Tab> Date
With this section, you can change the colors of the parts in the main body of the calendar.
Appointments
Go to Style Tab> Appointments
When you click on a date, it will show the appointment message box. In this section, you can edit the color of the appointment message box.
Style Tab (List Layout)
Now let’s explore the section of the style tab.
Heading
Go to Style Tab> Heading
Here, you can change the color and typography of the heading.
Time
Go to Style Tab> Time
In this section, you can change the color of text and icon as well as the typography of the times.
Navigation Button
Go to Style Tab> Navigation button
This section lets you customize the navigation button. You change its color, background, border, etc.
Appointment Button
Go to Style Tab> Appointment Button
In this section, you can change the appearance of the appointment button.
Additional
Go to Style Tab> Additional
Lastly, you can customize the small calendar button at the top-right corner of the calendar. Also, you can change the row borders’ color and width. Clicking on the calendar button will show you a mini-sized calendar. You can pick any date from there.
Video Assist
Well done. Seems you have learned the whole thing and how it works. It is easy and fun. Watch Video Assist and to get more in-depth ideas about the usage of the Booked Calendar widget, take a tour to the demo page.
[Note: on-page video link]
