Where do I find it?
Sales channels> Webshop
What does it mean?
At the moment, Palisis provides two Booking engines: “Widget” and “Desktop”. In this document, we detail various technical aspects of "Webshop Desktop," including:
- How to enable Google Analytics
- How to trigger features of the Desktop engine using HTTP-GET-Parameters
- How to embed a Desktop engine as an IFRAME
- How to manage an “external basket” when embeding a Desktop engine as an IFRAME
- Link to all configuration options a Desktop instance provides
A list of all current Desktop instance configuration options can be found here:
https://office.palisis.com/pit/v5/#/DesktopGlobal
To see the “core options” for every instance, click the “Edit” button and scroll down to visualize all the attributes:
Pros and Cons of the “Desktop” solution
Booking Engine “Desktop” - as a multi offer solution:
- PRO “Multi offer” booking engine including basket
- PRO Works as stand-alone solution (no own website needed)
- PRO A lot of branding/layout options
- PRO Allows booking of transport items, packages and products
- PRO Fully embeddable within IFRAME
- PRO Usable as “checkout only” solution when using the Webshop API
- PRO Fully integrated with Google Analytics
- CON If used as IFRAME or “check only”, more effort to integrate
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 is a “Desktop “instance”?
This configuration instance hold all information regarding that particular Desktop instance like which offer(s) are assigned/sold, shall the offers be sold with a timetable or not, layout options etc. One can create as many Desktop instances as needed. Note that there two sets of configuration options for a Desktop instance available: One set globally for a particular instance as well as for each offer assigned to that particular instance.
Each Desktop instance is identified by a system wide unique domain (aka <shop domain>).
The shop domain is self-assigned when you create a Desktop instance.
How to trigger features of the Desktop engine using HTTP-GET-Parameters
All examples are using the shop domain webshop-api-test - make sure you replace this with your own shop domain.
Force Mobile
GET parameter name |
value/description |
forcemobile |
true|false - if passed true forces the engine into its mobile rendering |
Example:
https://webshop-api-test.palisis.com/?forcemobile=true
Book Direct
GET parameter name |
value/description |
book-direct |
offerId which can be found in the Backoffice on the instance configuration screen - if passed, forces the engine to start the booking process with the given offer |
Example:
https://webshop-api-test.palisis.com/?book-direct=r-1541
Offer Direct
GET parameter name |
value/description |
offer-direct |
offerId which can be found in the Backoffice on the instance configuration screen - if passed, forces the engine to display ONLY this offer at the engine start screen - if the offer tile is collapsed, it will be expanded.
OPTIONALLY, it is possible to pass a comma-separated list of offerIds, where the passed offers are kept open and the rest of the offers are closed, which would be like:
offerId1,offerId2,offerIdN |
Example:
https://webshop-test-offer-direct.palisis.com/?offer-direct=r-1541
Example Comma Separated:
https://webshop-test-offer-direct.palisis.com/?offer-direct=r-1541,r-1561
Language / Locale
GET parameter name |
value/description |
locale |
en|de|es|it|fr forces the engine into the given locale -- 2 character language code used |
Example:
https://webshop-api-test.palisis.com/?locale=de
Force Basket
GET parameter name |
value/description |
forcebasket |
true|false - if passed true forces the engine to switch on all basket related features which may be switched off in the instance configuration - This is useful when the engine is running as IFRAME with basket switched off but the instance wants to be “reused” in mobile mode with full basket functionality. |
Example:
https://webshop-api-test.palisis.com/?forcebasket=true
How to embed a Desktop engine as an IFRAME
All examples/show cases use the shop domain webshop-api-test - make sure you replace this with your own shop domain.
The main point(s) covered here is, since the Desktop engine does not have fixed height and every step within the booking process may result in a different height of the engine, how the page hosting the engine IFRAME can correct the height of the IFRAME.
How to fix the variable height of the engine IFRAME (new method - introduced with Palisis 3.94)
The Palisis Desktop engine uses a third party tool called “iFrame Resizer”.
The tool is available at https://github.com/davidjbradshaw/iframe-resizer and following their “Getting started” we have are linking + serving the JavaScript iframeResizer.contentWindow.min.js with each Desktop engine instance. This is the only prerequisite to use this tool with hosting page (the customers page embedding the IFRAME).
Please follow the “Getting started” ff. on https://github.com/davidjbradshaw/iframe-resizer to setup “iFrame Resizer” on the page embedding the IFRAME.
NEW NOTE: with new desktop design, the use of this library must consider to use as heightCalculationMethod the value ‘taggedElement’. Also prevent from cross domain problems by using checkOrigin: false.
Sample code:
<iframe id="myIframe" src="https://mytestingshop.palisis.com/" style="width:100%; border:none"></iframe>
<script>
iFrameResize({checkOrigin:false, heightCalculationMethod: 'taggedElement'}, '#myIframe');
</script>
See our simple showcase for this here:
https://palisis-webshop-samples.palisis.com/simple-desktop-iframe.html
Other remarks when using IFRAMES
Note that when using a IFRAME and the given fact that the Palisis engines are always forced to HTTPS, we highly recommend for the host-page (the page embedding the IFRAME) to ALSO use HTTPS.
This is not only for User Experience, but also to prevent “cross domain” issues when loading the IFRAME. Some browser/OS versions will not load the IFRAME when host page and IFRAME-src do not use the same protocol.
Troubles with this IFRAME-height-correction may occur when on mobile phones, especially with the combination of iOS/iPhone/Safari.
Note that we strongly recommend to NOT use IFRAMES for mobile versions.
The Palisis Desktop engine comes with a excellent mobile rendering and we recommend to call the engine directly when your server/host page detects a mobile device.
However, if you want to keep using IFRAME with your mobile version, you will experience fewer problems with Android than with the above mentioned combination of iOS/iPhone/Safari.
Therefore we recommend adding the following fix to your host page when you detect iOS/iPhone/Safari:
<script>
document.ontouchmove = function(e){
if($(e.touches[0].target).closest('.somecssclass').length > 0){
return true;
}
e.preventDefault();
};
</script>
Given the fact that you have added class=”somecssclass” to your <body> tag.
Instance -level-Option “Force locale” and “Remove Locale from Header”
Allows to force a desktop shop instance into a given locale provided with it’s 2 letter locale code like “en” for English or “es” for Spanish. Also allows to remove one or more from the locale selection buttons in the shop UI’s header by a comma-separated list of 2 letter locale codes, e.g. “es,it” would remove Spanish (es) and Italian (it).
NOTE: using the “Force locale” option can not be used when the engine is IFRAMed