Booker25 Widget

The Booker25 Widget allows your customers a self-service booking process right on your home page, by looking for available spaces in your Booker25 Resources. It can be easily implemented on your website and will support customisations to brand the Widget accordingly.

Pre-requisites

Start with https://gen25-jira.atlassian.net/wiki/spaces/BPD/pages/2468151420

General Settings

  1. Fill in Name & Slug

  2. Check Publish landingpage

  3. Fill in Terms and conditions if applicable, or leave to None

  4. Set First day of week

  5. Choose a Default language

  6. Make sure to also enable that language under Enabled languages

Resource Settings

  1. Select if you want to create Leads or Contacts

    1. When using Leads, you can choose to Use company field. This will allow Leads to fill in a Company name.

  2. In Resource filters, select what kind of Resource should be the first layer that end users can select

  3. In Bookable resources, select which resources the bookings should be made in

  4. Leave Root Resource Salesforce id empty

Reservation Settings

  • In Reservation model, select Availability-based (only in widget)

  • Select a Default status, Default cancelled status and a Default reservation type

  • Leave Don't allow double booking unchecked

Timeslots

  • Configure a Timeslot length in minutes

  • If applicable, configure Gap between timeslots in minutes

Reservation Types

It’s possible to let the user select a reservation type. To insert this as an extra step, make at least one type selectable for the user.

It’s also possible to specify custom timeslot generator settings per reservation type. To use custom settings, set the duration to a non-zero value.

Complete Action

Leave this section empty

Header Settings

  • Logo: fill in the URL to your logo

Leave the rest as-is

Styling

Select a Primary colour

Widget

You can use the <script> snippet to use a button that opens a widget in the bottom right of the screen. Or use the <iframe> snippet to embed the widget anywhere on a web page. We will come back to this later.

Content

Configure I you want to show the Show the 'group size' step and Show payments sections

It’s possible to automatically pick a bookable resource by checking Automatically select a bookable resource, which will skip that step for the user. The resource is selected at random. If only one bookable resource is left after filtering, this step will also be skipped.

To skip the bookable resource details, uncheck Show selected resource step.

Button

  • Insert Text for the Widget button

  • Select Background color and Font color for the widget button text

  • Select Logo background color that will be visible behind the Booker25 logo on the Widget button

  • Select if Widget is open by default

Other

Provide any custom fields you may have

Done?

  • Press Add new App or Save in the bottom-right corner

  • Use the <script> snippet (the one from the Widget section from earlier on this page) to use a button that opens a widget in the bottom right of the screen. If you’re a website developer, you can use the <iframe> snippet combined with your own CSS to embed the widget anywhere on a web page.