Set up your booking engine

Adding Flip.to to your booking engine requires two snippets of code:

The first is added to every page of your booking engine.
The second is added to the confirmation page.

Before you begin

You'll need your unique IDs, which you should have received by email. If not, ask our Customer Success team.

If your website and booking engine are on the same domain, the instructions below apply only to your booking engine pages. A different snippet is required for your website pages.

Every page snippet

The following snippet should be modified to pass in the appropriate values (tokens are typically set in place of the actual values), and should be included in the <head> tag of every page of the booking engine, including the confirmation page.

For single page applications, this snippet should only be loaded at application start, not on virtual pageviews.

<!-- Flip.to - Booking Engine Integration -->
<script>
!function(b,e,i){(b[e]=b[e]||[]).push({flipto:i, event: 'flipto.configuration.load'})}(window,'fliptoDataLayer',{
	bookingEngine: 'BB',
	companyCode: 'XX',
	code: 'YYYY',
	language: 'en'

});
</script>
<script async src='https://integration.flip.to/K2X4KDP'></script>
<!-- Flip.to - End Booking Engine Integration -->

Confirmation page snippet

The following snippet should be modified to pass in the appropriate values and should be included in the <head> tag of the confirmation page to run once the guest has completed their reservation.

Most booking engines support dynamic tokens (i.e. %FirstName%) that allows the hotel to display the confirmation page with the guest’s details. If you’re not sure what these tokens are, please contact your booking engine’s support team or introduce our Customer Success team to them.

The confirmation page should include both the Every page snippet and the Confirmation page snippet (the order doesn't matter).

<!--Flip.to - Confirmation Page Start-->
<script>
	!function(n,e,w){
		w.eventData={category:'Booking_Engine',action:'Load',value:w.amount};
		(n[e]=n[e]||[]).push({flipto:w,event:'flipto.confirmation.load'});
	}(window,'fliptoDataLayer',
	{
		bookingEngine: 'BB',
		companyCode: 'XX',
		code: 'YYYY',
		confirmation: '67890',
		loyalty: '12333322',
		first: 'John',
		last: 'Smith',
		email: 'jsmith@flip.to',
		phone: '(212) 123-4567',
		startDate: '2022-4-10',
		endDate: '2022-4-13',
		guests: 5,
		adults: 3,
		children: 2,
		type: 'KING',
		rateCode: 'BAR',
		language: 'en',
		currency: 'USD',
		amount: 1234.12,
		addonAmount: 234.56,
		dateFormat: 'yyyy-M-d'
	});
</script>
<!--Flip.to - Confirmation Page End-->

Optional Dynamic Configuration

<!-- Flip.to - Configuration -->
<script>
  window.ftParams = {
  "_ga-ft"= "................."
  "enableAdobeCrossDomain": true
}
</script>
<!-- Flip.to - Configuration  -->

Troubleshooting: Conflicting website code snippet firing on engine pages

Confirm the trigger for the Website GTM Tag is firing on all pages of the website, but excludes firing on all pages of the TravelClick engine. The tag triggers should look like this:

PreviousBooking Engines NextVendors

Last updated 1 month ago