1 min lezen

# TeleportHQ

**You can embed calendars from Bookingmood in** **[TeleportHQ](https://teleporthq.io/)****.**

## Create a widget

- You will need to create a widget in Bookingmood first. Learn how to create it here: [Creating a widget](https://www.bookingmood.com/en-US/docs/widgets/create-a-widget).
- Click on _Embed_ and copy the _Inline_ embed code. You will need this in the next step.

## Add the widget to your TeleportHQ project

- Add an element by clicking on the + button.
- Drag and drop the _Code Embed_ element into your page.

![Code Embed](https://ksxynoprjyugtwuaqdho.supabase.co/storage/v1/render/image/public/website/images/30c3adaf-a1eb-4b99-bcee-f556658ca9fb.png?quality=75&resize=contain&width=3840)

- Paste the iframe-part of the embed code you copied.

```
<iframe
  src="YOUR-EMBED-URL"
  style="width:100%;border:none"
></iframe>
```

- Save it.
- Open the project menu and click on _Project Settings_.

![Project Settings](https://ksxynoprjyugtwuaqdho.supabase.co/storage/v1/render/image/public/website/images/f6b05e11-b0cf-41fd-8c57-25b5a7c4966a.png?quality=75&resize=contain&width=3840)

- Click on _Custom Code_.
- Add the following code in the body section:

```
<script src="https://www.bookingmood.com/js/resize.js"></script>
```

- So it looks like this:

![Custom code in the Body](https://ksxynoprjyugtwuaqdho.supabase.co/storage/v1/render/image/public/website/images/3f427066-e264-4703-8b5a-20cc801f73d2.png?quality=75&resize=contain&width=3840)

- Save it.

> Note that the calendar may appear cut off or may not display correctly in the TeleportHQ editor. Please check the live, published website to see how it is displayed correctly.

**🎉 You're done and everything is set! Changes you make to your calendar will automatically reflect on your website.**

Laatst gewijzigd 31 augustus 2026