** Using Wordpress? Try our Wordpress plugin! **

There are two ways to embed your calendar page on your website, using a simple iFrame or using the configurable inline pop-up API.

Embedding your calendar page inline

You can paste the following code snippet into your site's HTML to allow your guests to schedule a meeting from your website. Please update the "src" field with your own personalized calendar page URL. You can view all your links on my.x.ai/calendarpage.


<iframe src="https://x.ai/calendar/YOUR_URL" style="width:100%;min-height:600px;" scrolling="auto" > </iframe>

Embedding your calendar page as an inline pop-up

Below you will find a script tag. You can insert this script element anywhere in the <body> tag of your page and wherever you place it you will see a "Schedule a meeting" button appear. Clicking that button will open your calendar page.

Don't want to use our default button? No problem, read #4 below!

Customizing the code

There are a few elements you can customize in the script tag to modify the appearance of the calendar page.

  1. data-page: Specify your calendar page URL (e.g. /brian/phone) in the data-page element of the script. This is the only required field.
  2. data-width: You can set an explicit max-width in pixels. The default value is 800 pixels wide (maximum).
  3. data-height: You can set an explicit height in pixels as well. The default value is 85% of the page viewport. We recommend leaving this as-is.
  4. data-element: You can attach the pop up to any element on your page using a query selector (i.e. "#button" or "a.buttonClass.cta"). Clicking any matching element will then launch the calendar page. The default button will not appear if this is set.


<script type="text/javascript" src="https://x.ai/embed/xdotai-embed.js" id="xdotaiEmbed" data-page="/my-name/my-meeting" data-height data-width="500" data-element="#clickableElementID" async></script>


<script type="text/javascript" src="https://x.ai/embed/xdotai-embed.js" id="xdotaiEmbed"

Code generator

You can generate embed code for your calendar pages using this form.

Did this answer your question?