Palisis Widget Technical Documentation

Blanca Castillo
Blanca Castillo
  • Updated

Please note that this functionality has not been supported for the last few years and will be deprecated soon.

Where do I find it?

Sales channels> Widgets

35f1a662-560a-4923-9d72-63974eeb22af.png

 

What does it mean?

At the moment, Palisis provides two Booking engines: “Widget” and “Desktop”. In this document, we detail various technical aspects of "Widgets," including:

  • How to integrate a Widget with an existing website
  • Link to all configuration options a Widget instance provides

A list of all current Widget configuration options can be found here:

https://office.palisis.com/pit/v5/#/TokenShopRoute

Select an instance to see the “core options” in the right main panel and click the “Edit” button to see “advanced” options.

Widget instances are created using the Palisis Backoffice via Sales channels >Widgets.

 

Pros and Cons of the “Widget” solution

  • PRO Very fast integration with existing websites
  • PRO Minimal effort to integrate; only a few lines of code
  • PRO “Per Offer” booking engine with all facets (also allows booking of return items)
  • PRO Fixed form factor
  • CON Own website needed
  • CON This functionality has not been supported for the last few years and will be deprecated soon.

 

General Terminology

  • “shop owner” … The owner of the website which uses/embeds the Palisis Webshop; Palisis "Owner"
  • “buyer” … The person using the shop owner’s website

 

What should I do?

To use a widget, a Widget instance needs to be created first. This configuration instance holds all information regarding that particular widget, such as which offer is assigned/sold, whether the offer is sold with a timetable, layout options, etc. One can create as many Widget instances as needed.

A unique system-wide widget token identifies each widget instance.

This token is system-generated and assigned by the Palisis system.

This token is in the Palisis Backoffice once you have created a Widget instance, right where you created it.

How to integrate a Widget with an existing website

To integrate a widget into an existing website, a widget configuration instance needs to be created. This widget configuration provides a unique token used to open up the widget on the shop owner’s website. It holds all the configuration options for this widget, like which route or bundle group is assigned, language, layout, etc.

Note, that since the widget is a “per offer” booking engine, one must create a separate configuration instance (which leads to a separate token) per offer.

For demonstration, we use the following token <token>:

gd460ut7srnk5ep16cr4rmo0qe31424164667720

So, as a very basic way of accessing this widget, one can use the direct link:

https://<palisis host>/pit/webshop/widgetconfig?key=<token>

name

description

palisis host

office.palisis.com for production

uat.palisis.com for User Acceptance Testing

token

the widget token created with the widget configuration

 

e.g. https://office.palisis.com/pit/webshop/widgetconfig?key=gd460ut7srnk5ep16cr4rmo0qe31424164667720

This URL can be used as a direct link or as IFRAME-SRC.

So, given a simple website, Palisis provides a so-called “bootstrap” script, which allows embedding the widget in an existing website as “pop over”. To use this, the following steps are needed:

Given a website:

<html>
<head>
... your website head section
</head>
<body>
.... your website body section
</body>
</html>

 

E.g. In the <head> section of the website, we include the “bootstrap” script. This script can be included directly from the Palisis production system and is available with the following URL:

https://office.palisis.com/pit/scripts/widget.js

So, this script provides functions to trigger and assemble the “pop over” for this widget, and the function can be called a result of an event of your choice. The function is declared as follows:

function pitWidgetBootToken(token, (center)true/false);

So, using the website declared above, we add the script include to the <head> section and bind the function call to the “on-click” event of some DOM element like this:

<html>
<head>
<script
src='https://office.palisis.com/pit/scripts/widget.js'>
</script>
</head>
<body>
<button
onClick="javascript:pitWidgetBootToken('gd460ut7srnk5ep16cr4rmo0qe31424164667720', true);">
Book Now!
</button>
</body>
</html>

Note that using onClick is neither the recommended nor a good way to do this, but it showcases the paradigm very well. We encourage using a framework like JQuery to bind click events.

This is all needed to enable a widget configuration as a “pop-over” in an existing website.

See a simple showcase here:

https://palisis-webshop-samples.palisis.com/simple-widget.html