4. Activating Booking via Guest Checkout

Depending on your booking system setup, it is possible for the Live Timetables to deliver 2-click guest booking for PAYG users.

You will need to have completed these steps to enable this feature:

  1. Check with us about whether your licence includes this feature

  2. Activate the required APIs from your Booking System

  3. Creating and theming your branded checkout

  4. Updating the timetable code to turn on guest booking


1. Check with us about whether your licence includes this feature

Please get in touch with us at support@imin.co in the first instance, to check if your current agreement covers use of the guest booking feature. We will also be able to guide you through these steps and answer any questions you might have.

2. Activate the required APIs from your Booking System

Depending on your booking system, you will need to activate a set of APIs for imin to integrate with in order to activate the guest booking feature. We can help you identify if you do need additional APIs and the exact request you need to make of your booking system.

There is likely to be an additional cost from your Booking System if you do not already have the APIs needed for this feature.

3. Creating and theming your branded checkout

Please follow the steps under Setup for the imin guest checkout

4. Updating the timetable code to turn on guest booking

In addition to the standard fields in the timetable code that you used in a previous step, you will need to add the additional fields below

Variable / FieldField functionExample value

checkoutURL

When you have completed the steps here, you will have a specific url setup for your branded checkout, which needs to be added here.

checkoutUrl: 'https://checkout.haloleisure.org.uk/'

bookableProviders

We will tell you what value needs to be put here (usually some version of your organisation name).

bookableProviders: ['halo']

Therefore, the template code including the fields above, and the fields from the standard template, is below (click the button in the top right to copy the entire code).

<!-- Element to hold the timetable -->
<div id="timetable"></div>

<script>!function i(u,c,f){function a(t,e){if(!c[t]){if(!u[t]){var n="function"==typeof require&&require;if(!e&&n)return n(t,!0);if(s)return s(t,!0);var r=new Error("Cannot find module '"+t+"'");throw r.code="MODULE_NOT_FOUND",r}var o=c[t]={exports:{}};u[t][0].call(o.exports,function(e){return a(u[t][1][e]||e)},o,o.exports,i,u,c,f)}return c[t].exports}for(var s="function"==typeof require&&require,e=0;e<f.length;e++)a(f[e]);return a}({1:[function(e,t,n){var r,o,i=t.exports={};function u(){throw new Error("setTimeout has not been defined")}function c(){throw new Error("clearTimeout has not been defined")}function f(t){if(r===setTimeout)return setTimeout(t,0);if((r===u||!r)&&setTimeout)return r=setTimeout,setTimeout(t,0);try{return r(t,0)}catch(e){try{return r.call(null,t,0)}catch(e){return r.call(this,t,0)}}}!function(){try{r="function"==typeof setTimeout?setTimeout:u}catch(e){r=u}try{o="function"==typeof clearTimeout?clearTimeout:c}catch(e){o=c}}();var a,s=[],l=!1,h=-1;function d(){l&&a&&(l=!1,a.length?s=a.concat(s):h=-1,s.length&&m())}function m(){if(!l){var e=f(d);l=!0;for(var t=s.length;t;){for(a=s,s=[];++h<t;)a&&a[h].run();h=-1,t=s.length}a=null,l=!1,function(t){if(o===clearTimeout)return clearTimeout(t);if((o===c||!o)&&clearTimeout)return o=clearTimeout,clearTimeout(t);try{o(t)}catch(e){try{return o.call(null,t)}catch(e){return o.call(this,t)}}}(e)}}function p(e,t){this.fun=e,this.array=t}function y(){}i.nextTick=function(e){var t=new Array(arguments.length-1);if(1<arguments.length)for(var n=1;n<arguments.length;n++)t[n-1]=arguments[n];s.push(new p(e,t)),1!==s.length||l||f(m)},p.prototype.run=function(){this.fun.apply(null,this.array)},i.title="browser",i.browser=!0,i.env={},i.argv=[],i.version="",i.versions={},i.on=y,i.addListener=y,i.once=y,i.off=y,i.removeListener=y,i.removeAllListeners=y,i.emit=y,i.prependListener=y,i.prependOnceListener=y,i.listeners=function(e){return[]},i.binding=function(e){throw new Error("process.binding is not supported")},i.cwd=function(){return"/"},i.chdir=function(e){throw new Error("process.chdir is not supported")},i.umask=function(){return 0}},{}],2:[function(e,t,n){(function(t){"use strict";var c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e};window.iminTimetable=function(r,o){if("function"!=typeof document.querySelector)throw Error("The timetable could not be loaded: your browser does not support document.querySelector!");var i=t&&t.env&&t.env.EMBED_APP_TIMETABLE_URL||"https://imin-timetable-prod.herokuapp.com";if(!i)throw Error("The timetable could not be loaded: no URL was configured for the iframe.");var u=!1,e=function(){if(!u){u=!0;var e=document.querySelector(r),t=document.createElement("iframe"),n=void 0;for("object"===(void 0===o?"undefined":c(o))&&"string"==typeof o.height&&o.height.match(/^[0-9]+px$/)?n="height: "+o.height:"object"===(void 0===o?"undefined":c(o))&&"number"==typeof o.height&&(n="height: "+o.height+"px"),t.scrolling=!1,t.style="width: 100%;border: none;"+n,t.src=i+"/?embed=1",t.onload=function(){t.contentWindow.postMessage(JSON.stringify(o||{}),i),n||window.addEventListener("message",function(e){e.origin===i&&"number"==typeof e.data&&(t.style.height=e.data+"px")})};e.firstChild;)e.removeChild(e.firstChild);e.appendChild(t)}};"interactive"===document.readyState||"complete"===document.readyState?e():document.addEventListener("readystatechange",e)}}).call(this,e("_process"))},{_process:1}]},{},[2]);</script>
<!-- Set options and attach to the element -->
<script type="text/javascript">
var options = {
  apiKey: '',
  cache: true,
  checkoutUrl: '',
	customStyle: {
    button: {
      color: '',
      backgroundColor: '',
      ':hover': {
        color: '',
      },
      fontFamily: '',
    },
    filter: {
      fontFamily: '',
    },
    base: {
      fontFamily: '',
    },
    timetable: {
      color: '',
      backgroundColor: '',
    },
  },
  fonts: [],
  height: ,
  location: '',
  activity: '',
  bookableProviders: [''],
  shouldShowExactAvailability: ,
  shouldShowNoAvailability: ,
  shouldNotShowDeepLinkButton: ,
  memberDeepLinks: {
    {insert}: ''
  },
  showPrintButton: ,
  isCategoryFilter: ,
  admissionsPolicyUrl: '',
  };
  iminTimetable('#timetable', options);
</script>

Facilities (sports hall, pitches, courts etc)

We are currently developing the bookable facilities Live Timetable functionality, and expect it to be available very soon.

Last updated