JavaScript API

This JavaScript library can be used to render booking widgets on your website.

This is aimed at developers, an simpler way of generating widgets is documented on the Website Integration page.

Include the Javascript

To start using the API include the following script tag:

<script src="https://www.planfy.com/assets/js/widget.js"></script>

Popup Widget

The following code displays a floating widget trigger which launches a popup booking modal when clicked.

Remember to substitute your actual URL_KEY, optional parameters have been commented with //.

<script>
Pfy.init({
    url: 'URL_KEY',
//    color: '#000000',
//    square: false,
//    triggerTitle: 'Book Now',
//    triggerDescription: 'Click here to book our services',
//    locale: 'en',
//    newTab: true  // opens new tab on mobile
//    serviceId: null, // preselect a service 
//    serviceGroupId: null, // preselect a service group
});
Pfy.displayTrigger();
</script>

On-Page Inline Widget

The following code embeds the booking widget directly on a web page. It will expand to the with of its container.

Remember to substitute your actual URL_KEY, optional parameters have been commented with //.

<script>
Pfy.init({
    url: 'URL_KEY',
//    color: '#000000',
//    locale: 'en'
});
Pfy.displayTrigger();
</script>

Custom Popup Trigger

Firstly add the following code to initialize the config:

<script>
Pfy.init({
    url: 'URL_KEY',
//    color: '#000000',
//    locale: 'en',
//    newTab: true, // opens new tab on mobile
});
</script>

Then add Pfy.clickTrigger() to the onClick event of your custom trigger like below:

<a onClick="Pfy.clickTrigger()">Book Now</a>

Responsive Website

All of our widgets our mobile friendly, but this will only work if your own website is mobile friendly and contains a responsive meta tag <meta name="viewport" content="width=device-width">