Installation & Setup

Script Tag (Recommended)

Include the library directly in your HTML. Add data-resytech-* attributes to auto-initialize a ResytechClient instance:

<script
  src="https://js.resytech.com/latest/resytech.js"
  data-resytech-location-id="YOUR_LOCATION_ID"
  data-resytech-base-url="https://booking.yourdomain.com"
  data-resytech-debug="true">
</script>

This automatically:

Creates a ResytechClient instance with your configuration
Exposes it as window.resytech
Binds click handlers to any elements with data-resytech-activity-id, data-resytech-equipment-id, or data-resytech-equipment attributes

Script Tag Data Attributes

Attribute	Required	Description
`data-resytech-location-id`	Yes	Your Resytech location UUID (see below)
`data-resytech-base-url`	Yes	Base URL of your booking platform (e.g. `https://booking.yourdomain.com`)
`data-resytech-debug`	No	Set to `"true"` to enable console logging
`data-resytech-ota-code`	No	OTA attribution code, when embedding as an authorized partner. See OTA Partner Integration

Finding Your Location ID

To find your location UUID, log into the Resytech Dashboard, click your name in the top right corner, then go to Location Settings. Your location ID is displayed in the page header.

CDN

Load directly from the Resytech CDN. Choose a versioning strategy that fits your needs:

<!-- Pinned to exact version (recommended for production) -->
<script src="https://js.resytech.com/1.0.0/resytech.js"></script>

<!-- Major version — always gets the latest v1.x release (non-breaking updates only) -->
<script src="https://js.resytech.com/1/resytech.js"></script>

<!-- Latest — always the newest release -->
<script src="https://js.resytech.com/latest/resytech.js"></script>

Versioning Options

URL Pattern	Example	Updates	Best For
`/{major}.{minor}.{patch}/resytech.js`	`/1.0.0/resytech.js`	Never changes	Production sites that want full control over upgrades
`/{major}/resytech.js`	`/1/resytech.js`	Bug fixes and new features within the major version	Production sites that want automatic non-breaking updates
`/latest/resytech.js`	`/latest/resytech.js`	Every release including major versions	Development and testing only

The /latest URL can include breaking changes when a new major version is released. Use a pinned version or major version URL for production sites.

If you omit the data-resytech-* attributes on the script tag, no auto-initialization occurs. You can then create instances manually in your own JavaScript.

Global Exports

When loaded via script tag, the library exposes these globals on window:

Global	Type	Description
`window.ResytechClient`	Class	The booking widget class
`window.ResytechApi`	Class	The API client class
`window.ResytechBlogRenderer`	Class	The blog renderer class
`window.resytech`	Instance	Auto-initialized `ResytechClient` instance (only when `data-resytech-location-id` and `data-resytech-base-url` are set on the script tag)

Manual Initialization

If you prefer not to use auto-initialization, create a client instance yourself:

const client = new ResytechClient({
  locationId: 'YOUR_LOCATION_ID',
  baseUrl: 'https://booking.yourdomain.com',
  theme: {
    primaryColor: '#007bff',
    fontFamily: 'Inter, sans-serif'
  },
  debug: false
});

The ResytechApi client is configured separately:

const api = new ResytechApi({
  baseUrl: 'https://api.bookingui.com/v1',
  cmsBaseUrl: 'https://cms.bookingui.com',
  debug: true,
  timeout: 30000
});

Next Steps

ResytechClient Reference -- full widget API
Embedding the Booking UI -- data attributes and pre-fill options
ResytechApi Reference -- building custom flows

On this page