This tutorial is kindly provided by the plugin developer. You can access the full plugin's documentation on this URL: https://boxystudio.ticksy.com/articles/7827/
Install the Booked Plugin
1. First things first, go to Plugins > Add New.
2. Upload the booked.zip plugin file and activate the Booked plugin.
3. Yep, that's it! For more help with installing plugins, take a look at this quick guide.
Create a Profile Page
If you would like your customers to be able to manage their own appointments and edit their profile, you'll want to activate the profile page. It's an easy process though, just follow the guide below:
1. Create a page and give it a title. "Profile" works, but it can be whatever you want it to be.
2. Add the [booked-login] shortcode to the page so your users can log in to view their profile.
3. Go to the Booked Settings panel (Appointments > Settings) and choose this new page from the dropdown in the General Settings tab.
4. And that's it!
The Booked Settings Panel
Head on over to the
Appointments > Settings page to familiarize yourself with the settings panel for Booked.
GENERAL SETTINGS
1. Profile Page - As described above, you will choose the page you want to use for the profile from this dropdown.
2. Time Slot Intervals - When creating your default time slots (described below), you can choose the intervals at which you can choose your time slots. Just change it with this dropdown.
USER EMAILS
All emails can be turned off one by one by simply removing the content of the email in the fields. If nothing is there then no email is sent. All emails have special tokens you can use in place of actual content. This content is placed into the email when it gets sent. The tokens are listed above each email form.
1. Registration - This is the email that is sent to your new users, welcoming them to your website.
2. Appointment Confirmation - This email is sent to the user when they book an appointment as a confirmation that the appointment has been submitted.
3. Appointment Approval - This is the email that is sent to the user when their appointment is approved.
4. Appointment Cancellation - This is the email that is sent to the user if their appointment is cancelled by the website admin.
ADMIN EMAILS
1. New Appointment Request - This email is sent to the admin user when a new appointment is created and is now in the pending list.
2. Appointment Cancellation - This email is sent to the admin user when a customer cancels an appointment from their profile.
DEFAULT TIME SLOTS
Setting your default time slots is at the heart of the Booked plugin. Each day is given default time slots. For example, if your business is open Monday – Friday from 8:00am – 4:00pm and you have 2 employees available every hour, you would create 2 times slots every hour from 8–4, Monday – Friday.
BULK TIME SLOT ENTRY
To quickly add a bunch of time slots, you can use the Bulk time slot entry option:
- Click "Add..." at the top of the day you're adding time slots to.
- Switch to the "Bulk" tab.
- For the "Start time...", select "8:00am".
- For the "End time...", select "4:00pm".
- Leave the next dropdown as "Every 1 hour" to set your time slots every hour.
- Choose "2 time slots" as the last option, and then click "Add".
- Your available time slots for that day will then be added and your customers can start booking appointments!
SINGLE TIME SLOT ENTRY
Alternatively, you can add a single time slot to any day/time:
- Click "Add..." at the top of the day you're adding time slots to.
- Choose a "Start time" and "End time" and then select how many time slots you want to add.
- Click "Add" and that time slot entry will be added as a default for that day.
CUSTOM TIME SLOTS
Adding Custom Time Slots
- Go to the Booked Settings panel and then go to the Custom Time Slots tab.
- Click the "Add Date(s)" button.
- Choose the calendar you want to use (if applicable).
- Choose the Start Date.
- If this is a one day setting, you can leave the End Date blank. If this is a date range, choose the End Date.
- To add a single time slot, click the "+ Single Time Slot" button. To bulk add time slots, click the "+ Bulk Time Slots" button.
- For single time slots, you'll choose how many available appointments for this time slot and then you'll choose the start and end times. Alternatively, you can check the "All day" checkbox to make this an all day time slot.
- To add bulk time slots, choose how many available appointments there are, choose a start and end time for the entire span of your day, choose the time between each slot if you need a 10 minute break for example. Then choose the interval for the time slots to be entered.
- Adding Vacation/Closed Dates
- Go to the Booked Settings panel and then go to the Custom Time Slots tab.
- Click the "Add Date(s)" button.
- Choose the calendar you want to use (if applicable).
- Choose the Start Date.
- If this is a one day setting, you can leave the End Date blank. If this is a date range, choose the End Date.
- Check the "Disable appointments" checkbox to make this a vacation/closed date.
- That's it
Step 2: How to add a Booked Calendar element
Please go to the page/post where you'd like to add the element, copy the code below, click on the Text tab of the editor and paste the code on the bottom of the page:
[column parallax_bg="disabled" parallax_bg_inertia="-0.2" extended="false" extended_padding="true" background_color="" background_image="" background_repeat="" background_position="" background_size="auto" background_attachment="" hide_bg_lowres="false" background_video="" vertical_padding_top="15" vertical_padding_bottom="60" more_link="" more_text="" left_border="transparent" class="" id="" title="APPOINTMENT" title_type="single" animation="from-bottom" width="1/1" last="true"] [blank h="10"] [/blank] [column_1 width="1/1" last="true" title="" title_type="single" animation="none" implicit="true"] [booked-calendar] [/column_1] [/column]
Click the Update button, then switch to the Vamtam tab and you'll see the element styled as on our demo pages:
You can add a calendar element to any place using the shortcode [booked-calendar] - simply add it to a Text element (Guide to VamTam Drag and Drop Builder / Visual Composer)
Translation
You can translate the plugin's strings in the booked.pot file (located in /wp-content/plugins/booked/languages/booked.pot) using the POEdit Method How to translate a Vamtam theme in other language? or some plugin for the multilingual site (How to make a Vamtam theme multilingual?)
Booked Add-On: Front-End Agents
Full plugin's documentation: https://getbooked.io/
Front-End Agents — Your Booking Agents will have a new profile screen on the front-end that allows them to manage their incoming appointment requests.
Booked Add-On: WooCommerce Payments
Full plugin's documentation: https://getbooked.io/booked-woocommerce/
Payments with WooCommerce — Use Booked with WooCommerce to allow your visitors to purchase their appointments and checkout using WooCommerce.
Booked Add-On: Calendar Feeds
Full plugin's documentation: https://getbooked.io/
Calendar Feeds — Display your appointments on Apple Calendar, Outlook, etc. with an iCal feed directly from your site. (not a two-way sync)