Embed Widget

The Proximity embed widget lets you add a scheduling experience directly to your website without building a custom integration. Visitors can book meetings without ever leaving your page.

Availability

Embed widgets are available on Standard and Teams plans.

Embed Modes

Proximity supports three embed modes, each suited to different use cases:

How It Works

All embed modes work by loading a small JavaScript snippet on your page that renders an iframe with the Proximity scheduling UI. The iframe communicates with the host page via postMessage.

1. Add the embed script to your page
2. Configure the embed via data-proximity-* attributes on a DOM element
3. The script renders the appropriate UI (inline iframe, popup trigger, or floating button)
4. The visitor completes the booking inside the embedded UI
5. Optional: listen for message events to react when a booking is completed

Embed Script

All modes use the same script tag:

<script src="https://app.proximity.io/embed/v1/proximity-embed.js" async></script>

The script is lightweight (~5 KB gzipped), loads asynchronously, and does not block page rendering.

Configuration Attributes

All embed modes share these configuration attributes:

Listening for Events

The embed widget posts messages to the parent window when key events occur:

window.addEventListener('message', (event) => {
  if (event.origin !== 'https://app.proximity.io') return;
 
  const { type, data } = event.data;
 
  switch (type) {
    case 'proximity:booking-created':
      console.log('Booking created:', data.bookingId);
      // Track conversion, show thank-you, etc.
      break;
 
    case 'proximity:slot-selected':
      console.log('Slot selected:', data.startTime);
      break;
 
    case 'proximity:popup-opened':
      console.log('Popup opened');
      break;
 
    case 'proximity:popup-closed':
      console.log('Popup closed');
      break;
  }
});

Event Types