Search the site:

Home Blog Alternate way to send WooCommerce Bookings To Different Google Calendars For Each Bookable Product

Alternate way to send WooCommerce Bookings To Different Google Calendars For Each Bookable Product

Our Booking & Appointment Plugin for WooCommerce has a feature named Google Calendar Sync. This setting allows you to automatically export the bookings for a WooCommerce product to Google Calendar in real-time.

This is an alternate way to send WooCommerce Bookings to different Google Calendars for each Bookable Product. The screens you will see in the post are according to the latest Google screens.

We have also written a post previously on this topic. You can refer to it if the steps mentioned below do not match your Google calendar setup.

Step 1: Google Developer’s Console

To use the integration to Google Calendar, go to the Google Developers Console to setup a project and enable the settings as needed. You need to Login to your Google account if you are not already logged in.

Step 2: Create Project

Create a new project by clicking on Services icon on top left corner. Click on Home button.

Home
Home

Click on Create button.

Create
Create

As you click on Create button a popup will be displayed asking for Project Name. Here enter a Project Name of your preference(e.g. Bookings GCal Test). As you enter the name, Project ID will be displayed automatically below the Project Name. Click on Create button after entering the details.

Create New Project
Create New Project

A project will be created and you will be redirected to the Dashboard.

Dashboard
Dashboard

Once the project is created, the project folder is loaded. Now you go to the API Manager on the left-hand menu.

API Manager
API Manager

Click on Library button and then click on “Calendar API” under “G Suite APIs“.

Library
Library

Step 3: Enable the Calendar API 

Click on Enable button.

Enable
Enable

Step 4: Create credentials

As you click on Enable, a notification will be displayed informing you that you may need to create credentials. Click on the Create credentials button in the notice.

Create credentials
Create credentials

On clicking Create credentials button, you need to select the Google Calendar API under Which API are you using?, Where will you be calling the API from? as Web Browser (Javascript) from the drop-down and select User Data from What data will you be accessing? as the data that will be accessed as shown in the below image.

Add credentials to your project
Add credentials to your project

You can skip the Add credentials to your project step and click on client ID link.

client ID
client ID

Once you clicked the “client ID” link, you will be redirected to the Create client ID page and click on Configure consent screen button in the notice.

Configure Consent screen
Configure consent screen

Now click on OAuth consent screen. Enter a Product Name of your preference (e.g. Bookings & Appointments) and click on Save button. You can enter extra customization options.

OAuth Consent Screen
OAuth Consent Screen

Once saved, set the Application type as the Web application. Now enter a Name of your preference (e.g. Booking & Appointment Web Client) and click on Create as shown below.

OAuth Client Creation
OAuth Client Creation

After clicking create button it will generate the OAuth Client and a popup will be displayed with your client ID and client secret so just click Ok button.

Popup displaying client ID and Client Secret
Popup displaying client ID and Client Secret

Step 5: Create Service Account

To create a service account, click on Create credentials->Service Account Key.

Service account key
Service account key

Now you will be redirected to Create service account key page.

New Service account
Create service account key

Click on Service account drop-down and select the New service account.

New Service account
New Service account

Now enter the name of your preference (e.g. Compute Engine default service account). Also, Select a role as Owner inside Project and set the Key Type to P12 and click on Create.

Create Service account key
Create Service account key

A file with extension .p12 will be downloaded and a pop-up will be displayed stating that the file has been saved on your device.

Pop-up window with the file name
Pop-up window with the file name

Please keep this file saved as this file needs to be uploaded to wp-content/plugins/woocommerce-booking/includes/gcal/key/ using the FTP client program.

This file is required as you will grant access to your Google Calendar account even if you are not online. So this file serves as a proof of your consent to access your Google calendar account.

Note: This file cannot be uploaded in any other way. If you do not have FTP access, ask the website admin to do it for you.

Copy the Key File Name excluding the .p12 extension
Copy the Key File Name excluding the .p12 extension

Step 6: Setup the Key File Name in Booking Settings

Copy the Key File Name (excluding the .p12 extension).

Copy the Key File Name excluding the .p12 extension
Copy the Key File Name excluding the .p12 extension

Then paste it in Booking->Google Calendar Sync Settings->Key File Name while creating the product.

Enter Key File Name (excluding the .p12 extension)
Enter Key File Name (excluding the .p12 extension)

Step 7: Service Account Email Address

Now go to Home in services icon and click on Go to project settings in Project Info box.

Go to project settings
Go to project settings

You will be redirected to the below screen.

Settings
Settings

Click on Service accounts on the left pane of the screen. You will see below screen and copy the Service account ID.

Copy Service account ID
Copy Service account ID

Paste the copied Service Account ID into Booking->Google Calendar Sync ->Service Account Email Address field.

Enter Service Account Email Address
Enter Service Account Email Address

Step 8: Create Calendar

Open your Google Calendar by clicking this link: https://www.google.com/calendar/render. Now to create a calendar, you need to go to My Calendars->Create New Calendar. Please try not to use the Primary Calendar. Give the Calendar a name of your preference (e.g. Bookings & Appointments Details) and ensure that the Calendar Timezone matches the WordPress Timezone on your site.

send WooCommerce Bookings to different Google Calendars- Create New Calendar
Create New Calendar

There will be Share with specific people option below Timezone where you need to enter the email address entered in Service Account Email Address field. Set the “Permission Settings” to Make changes to events and click Add Person. This will ensure that the application can create new events. Lastly, click on Create Calendar.

send WooCommerce Bookings to different Google Calendars- Share with specific people
Share with specific people

Step 9: Enter the Calendar ID

Once the calendar is created, copy the Calendar ID from the Calendar Settings listed in the Calendar Address as shown in the below image.

Calendar ID
Calendar ID

Paste the copied Calendar ID inside Booking->Google Calendar Sync Settings->Calendar to be used.

Enter Calendar ID
Enter Calendar ID

Step 10: Test the connection

Now all the 3 fields i.e. Key file nameService account email address, and Calendar to be used are filled while creating your product. Publish your product. Then click the Test Connection link to test the connection.

If your connection is successful a message will be displayed as below:

send WooCommerce Bookings to different Google Calendars- Test Connection Successful
Test Connection Successful

Note: If you get an error message, double check your settings.

As the connection is successful it should add a current dated event in your calendar as shown below:

send WooCommerce Bookings to different Google Calendars- Test Event
Test Event

Step 11: See Bookings in your Google Calendar

Once the settings are done, the plugin will export the bookings to the calendar as soon as an order is placed.

send WooCommerce Bookings to different Google Calendars- Exported Booking
Exported Booking

The event will contain the bookings and client details based on the merge tags inserted in Booking->Settings->Google Calendar Sync->General Settings.

 Booking Details
Booking Details
Browse more in: Booking, Documentation, How Tos, WooCommerce, WordPress

Leave a Reply

avatar

This site uses Akismet to reduce spam. Learn how your comment data is processed.

  Subscribe  
Notify of
from purchased

Subscribe for more offers