Articles on: Even Type Options

How to setup custom thank you page redirection or trigger third party analytics after booking using JS events?

To use this feature, a WP programmer with JS knowledge is recommended. For non programmers an UI friendly version will be launched soon.

This feature is in Beta.

This feature is meant to work for premium plugin users only.

Booking JS events -


The following events will be triggered in JS after the successful action as follows:
After new booking confirmed - wpcal_booking_new event will be trigged
After reschedule booking confirmed - wpcal_booking_rescheduled event will be trigged
After booking cancellation is confirmed - wpcal_booking_cancelled event will be trigged

#Examples
Redirect to custom thank you page on successful booking
Trigger FaceBook Pixel analytics on successful booking
Trigger Google Analytics event on successful booking

Example: Redirect to custom thank you page on successful booking


Write the following code in front end or admin end JS using child theme or using a custom CSS/JS plugin.

var booking_event_redirect_handler = function(e) {
  // console.log(e.details);
  // add/call your code here
  window.location.replace("https://example.com/custome-thank-you-page/");
};

document.addEventListener("wpcal_booking_new", booking_event_redirect_handler);

booking_event_redirect_handler() JS function can be customized based on your needs.

Example: Trigger FaceBook Pixel analytics on successful booking


Write the following code in front end or admin end JS using child theme or using a custom CSS/JS plugin.
Requirement: The FB pixel's base code must already be installed on every page where you want to track conversions.
var booking_event_fb_trigger_analytics_handler = function(e) {
  // console.log(e.details);
  // add/call your code here
  fbq('trackCustom', 'MeetingBooked');
};

document.addEventListener("wpcal_booking_new", booking_event_fb_trigger_analytics_handler);

booking_event_fb_trigger_analytics_handler() JS function can be customized based on your needs.

Example: Trigger Google Analytics event on successful booking


Write the following code in front end or admin end JS using child theme or using a custom CSS/JS plugin.
Requirement: The Google Analytics's base code must already be installed on every page where you want to track conversions.
var booking_event_ga_trigger_analytics_handler = function(e) {
  // console.log(e.details);
  // add/call your code here
  ga('send', 'event', 'Meeting', 'added');
};

document.addEventListener("wpcal_booking_new", booking_event_ga_trigger_analytics_handler);

booking_event_ga_trigger_analytics_handler() JS function can be customized based on your needs.

Updated on: 06/10/2021

Was this article helpful?

Share your feedback

Cancel

Thank you!