With the two-way synchronization feature between Bookingor and Google Calendar, staff members can seamlessly view their appointments in their Google Calendar, and customers can automatically add their scheduled appointments to their Google Calendar. This feature ensures that both staff and clients stay organized and updated with real-time changes.

How Google Calendar Two-Way Synchronization Works

• For Staff: Once the synchronization is set up, staff members will see their appointments automatically synced to their Google Calendar. This makes it easy for them to manage their schedule, whether they are using Bookingor or Google Calendar.
• For Customers: After a customer books an appointment through the Bookingor system, they have the option to add the appointment to their Google Calendar. This feature ensures that customers don’t forget their appointments and can integrate them directly into their personal calendars.

Google Calendar Integration for Bookingor

This guide explains how to set up and use the Google Calendar integration in Bookingor. This feature allows you to sync bookings with your staff's Google Calendars.

Table of Contents

1. Prerequisites: Google Cloud Setup
2. Plugin Configuration
3. Connecting Staff to Google Calendar
4. Troubleshooting

---

1. Prerequisites: Google Cloud Setup

Before configuring the plugin, you need to set up a Google Cloud Project and generate API credentials.

1. Go to the Google Cloud Console
2. Create a New Project (or select an existing one).

1. Enable Google Calendar API:
   • Navigate to APIs & Services > Library.

• Search for "Google Calendar API" and click Enable.

1. Configure OAuth Consent Screen:
   • Go to APIs & Services > OAuth consent screen.

1. Select External (unless you are a Google Workspace user restricting to internal users) and click Create.
2. Fill in the required App Information (App name, User support email, etc.) and save.
3. Test Users: If your app is in "Testing" mode, add the email addresses of the Google accounts you intend to connect.
4. Create Credentials:
   • Go to APIs & Services > Credentials.
   • Click Create Credentials > OAuth client ID.
   • Select Web application as the Application type.
   • Name: Give it a name (e.g., "Bookingor Integration").
   • Authorized redirect URIs: You must add the Redirect URI found in your Bookingor Settings.
     • To find this, go to your WordPress Admin > Bookingor > Settings > Integration > Google Calender.
     • Copy the URL from the Staff Admin Redirect URI
     • Field (usually looks like https://your-site.com/wp-admin/admin.php?page=bookingor-staff).
     • Paste this URL into the Authorized redirect URIs field in the Google Cloud Console.
   • Click Create.
5. Copy Credentials:
   • Copy the Client ID and Client Secret. You will need these for the next step.

---

2. Plugin Configuration

Once you have your Google API credentials, configure the integration in Bookingor.

1. Log in to your WordPress Dashboard.
2. Navigate to Bookingor > Settings.
3. Click on the Integration tab and select Google Calender.
4. Enable Integration: Toggle the switch to Enable (it might say "Disabled" when off).
5. Enter Credentials:
   • Paste your Client ID into the "Client ID" field.
   • Paste your Client Secret into the "Client Secret Key" field.
6. Redirect URIs: Ensure the URIs match what you set in the Google Cloud Console.
7. Event Configuration:
   • Title: Customize the event title that appears in Google Calendar (e.g., [#service_name]).
   • Description: Customize the event description using placeholders (e.g., Appointment from [#customer_first_name]). You can find a list of available placeholders (Category, Services, Staff, Customer, etc.) in the accordion menu below the settings.
8. Additional Options:
   • Enable Google Meet: Toggle if you want to automatically generate Google Meet links.
   • Add Attendee to Google Calendar: Toggle to add the customer as an attendee.
9. Click Save at the top right of the page.

---

3. Connecting Staff to Google Calendar

After the global integration is set up, each staff member needs to connect their specific Google Calendar account.

1. Navigate to Bookingor > Staff.
2. Click Edit (the pencil icon) on a Staff member's profile.
3. Ensure you are on the Basic Detail tab.
4. Scroll down to the Add Staff Image / About section.
5. Look for the Google Calendar section.
6. Connect:
   • Click the Sign in with Google button.
   • You will be redirected to Google to choose your account.
   • Allow the permissions requested by the app.
   • Once authorized, you will be redirected back to the Staff Edit page.
7. Verify: You should now see a Signout from Google button, indicating the account is connected.

Now, whenever a booking is made for this staff member, it will automatically be synced to their connected Google Calendar.

---

4. Troubleshooting

• Error 400: redirect_uri_mismatch:
  • This error occurs when the URL in your browser address bar does not exactly match the "Authorized redirect URI" you entered in the Google Cloud Console.
  • Check for differences in http:// vs https://, www vs no-www, or trailing slashes.
  • Ensure you copied the "Staff Admin Redirect URI" exactly from the Bookingor Settings page.
• Error 403: Access Denied / Project Not Authorized:
  • Ensure you have enabled the "Google Calendar API" in the API Library of your Google Cloud Project.
  • If your app is in "Testing" status on the OAuth Consent Screen, ensure the user email you are trying to connect is added to the "Test Users" list.
• "Connect with Google" button does nothing:
  • Check your browser console for JavaScript errors.
  • Verify that the "Enable" toggle is switched on in Bookingor > Settings > Integration > Google Calender.
• Events are not syncing:
  • Verify the staff member is connected (shows "Signout from Google").
  • Check if the Enable toggle is on in the main settings.