Customize and control

Match your website

The dashboard has a small theme editor under Developers → Website booking → Match your website. It writes these options into your snippet for you. They work on every widget type.

<div data-bewtee-widget="services" data-business="YOUR_BUSINESS_ID"
     data-color="#0f766e" data-radius="round" data-font="serif" data-heading="hide"></div>

For the plain iframe, pass the same choices in the address (the colour without the #):

https://bewtee.com/embed/YOUR_BUSINESS_ID?color=0f766e&radius=round&font=serif&heading=0

Very light colours are darkened a little inside the booking steps so white text stays readable. Everything else about the booking flow (layout, steps, wording) is the same as your Bewtee booking page.

Other options

The Book Now button inherits your page's font. To style it fully yourself, use your own element with data-bewtee-book.

JavaScript API

embed.js adds one global, Bewtee:

Bewtee.open(123, { color: '#0f766e', radius: 'round' }); // open the booking popup
Bewtee.close();                          // close it
Bewtee.init();                           // render widgets added to the page after load

Call Bewtee.init() after inserting widget markup dynamically, for example in a single-page app.

Events from the iframe

The booking page posts messages to the page that embeds it. Use them for analytics. Always check the origin.

window.addEventListener('message', (event) => {
  if (event.origin !== 'https://bewtee.com' || event.data?.source !== 'bewtee-embed') return;

  if (event.data.type === 'booked') {
    // event.data.status is "accepted" or "pending"
  }
});

Security and privacy

• The widget runs in an iframe served by bewtee.com. Your page cannot read what customers type into it, and it cannot read your page.
• It sets no cookies and needs no API key. Never put an API key in a web page.
• If your site sends a Content-Security-Policy header, allow https://bewtee.com in script-src and frame-src.