Cloudbeds

Adding Flip.to to your booking engine requires adding just one snippet of code to your booking engine.


Let's start

1

Sign in to your Cloudbeds account

Then open the profile menu found in the top-right corner and look for Settings.

2

Go to Settings

Click on Booking Engine on the left, then the Customize tab.

3

Add the Flip.to snippet

Modify the following snippet to include your unique IDs for COMPANY_CODE and PROPERTY_CODE and paste it into the Javascript section.

<!-- Flip.to - Booking Engine Integration -->
<script>
!function(w,f){
    var COMPANY_CODE = 'CHANGE_ME';
    var PROPERTY_CODE = 'CHANGE_ME';

    w.addEventListener("on-booking-engine-ready", bookingEngineReadyListener);            
    function bookingEngineReadyListener(e) {
        // Flipto Every Page Snippet
        (w[f]=w[f]||[]).push({flipto:{
            bookingEngine: 'cloudbeds',
            companyCode: COMPANY_CODE,
            code: PROPERTY_CODE,
            language: document.documentElement.lang
        }, event: 'flipto.configuration.load'});

        // Set up Confirmation Page handler
        if (e && e.detail && e.detail.eventSystem) {
            e.detail.eventSystem.addEventListener("reservation-created", reservationCreatedListener);
        }
    };

    function reservationCreatedListener(e) {
        // Flipto Confirmation Page Snippet
        (w[f]=w[f]||[]).push({flipto:{
            bookingEngine: 'cloudbeds',
            companyCode: COMPANY_CODE,
            code: PROPERTY_CODE,
            confirmation: e.booking_id,
            first: e.resRooms[0].guest_first_name,
            last: e.resRooms[0].guest_last_name,
            startDate: e.checkin_date,
            endDate: e.checkout_date,
            adults: e.resRooms.reduce((acc,room) => acc+(+room.adults), 0),
            children: e.resRooms.reduce((acc,room) => acc+(+room.kids), 0),
            type: e.resRooms[0].room_type_name,
            rateCode: e.resRooms[0].rate_id,
            language: document.documentElement.lang,
            currency: e.currency_code,
            amount: e.resRooms.reduce((acc,room) => acc+(+room.total), 0) + e.total_tax,
            addonAmount: e.booking_total - e.resRooms.reduce((acc,room) => acc+(+room.total), 0) - e.total_tax,
            dateFormat: 'yyyy-M-d',
            eventData: {
                category: 'Booking_Engine',
                action: 'Load',
                value: e.booking_total
            }
        },event:'flipto.confirmation.load'});
    }
}(window,'fliptoDataLayer')
</script>
<script async src='https://integration.flip.to/K2X4KDP'></script>
<!-- Flip.to - End Booking Engine Integration -->

And you're all set! If we can be of any help, say hello to our Customer Success team.

Last updated