BookingJs Overview

Integrate BookingJs, the timum booking widget, into your website or app – this overview covers getting started, quickstart, and features.

Which path is right for you?

Embed code from timum: Copy and paste the code from the Provider Channel – done, no programming required (see Quickstart below). Later adjustments: global configuration.

Developer integration with BookingJs: Embed via script tag, ESM, or React – full control over all options. Go to the integration guide.

Quickstart

The easiest way to embed the timum booking widget is via a Provider Channel. In the timum interface, an embed code is automatically generated for each Provider Channel:

Automatically generated embed code (Provider Channel)
<div id="timumContainer-<provider-channel-uuid>"></div>
<script
  type="module"
  src="https://www.timum.de/<provider-uuid>/<provider-channel-uuid>/widget.js">
</script>

Prerequisite:

To get this code, you must first create a Provider Channel in timum. The embed code is then generated automatically and can be copied directly. Provider Channels

Features

  • Real-time availability and booking
  • Booking requests for public appointments (with confirmation)
  • Appointments with multiple participants
  • Visitor recognition through CRM integration
  • Option to show/hide fully booked appointments
  • Lead time configuration
  • Prevention of double bookings
  • Cancellation by customers with authentication
  • Fully customizable design with MUI theming (PRO)
  • Customizable text in all languages (PRO)
  • Dynamic form fields with validation (PRO)
  • Support for 5 languages (DE, EN, FR, ES, IT)
  • Callbacks for custom event handling

What's next

Everything BookingJs displays and does is controlled through a single configuration object: appConfig. The three most important topics:

What does the widget display?: Referencing – which resource, which products, and which channel are shown.

How does it behave and look?: Configuration – all appConfig options in detail: appearance, behavior, language.

How do I respond to bookings?: Callbacks – react to events such as successful bookings and trigger your own logic.

PRO Features

With a Professional plan, you have access to additional customization options:

  • Custom Theming: Full customization of the design with an MUI theme
  • Custom Fonts: Load and use your own fonts
  • Localization: Customize all texts and add your own languages
  • Custom Fields: Additional form fields with validation
  • Hide footer: Hide “Powered by timum”

For Users