[Интеграције](https://www.bookingmood.com/sr-Cyrl/integrations) [Website builder](https://www.bookingmood.com/sr-Cyrl/integrations?category=Website%20builder)TeleportHQ

![TeleportHQ](https://ksxynoprjyugtwuaqdho.supabase.co/storage/v1/render/image/public/website/covers/ef75a1b7-aa61-4221-b521-bbd20c67d263.png?quality=75&resize=contain&width=640)

# TeleportHQ

Add Bookingmood booking calendars to your TeleportHQ website

[Документација](https://www.bookingmood.com/sr-Cyrl/docs/channels/widgets) [teleporthq.io](https://teleporthq.io/) ✓ Доступно

Add Bookingmood to your [TeleportHQ](https://teleporthq.io/) website so guests can check availability and book your rental without leaving your site. You set it up once, and every change you make in Bookingmood shows on your website automatically.

## [Create a widget](#create-a-widget)

- Create a widget in Bookingmood. [Widgets](https://www.bookingmood.com/en-US/docs/channels/widgets) explains how.
- Click _Embed_ and copy the _Inline_ embed code. You need it in the next step.

## [Add the widget to TeleportHQ](#add-the-widget-to-teleporthq)

TeleportHQ doesn't run scripts inside a code embed, so you add the widget and the script that sizes it separately.

- Click the _+_ button to add an element and drag the _Code Embed_ element onto 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 only the _iframe_ part of the embed code you copied. It looks like this:

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

- Save your changes.
- Open the project menu and click _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 _Custom Code_ and add the following code to the body section:

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

![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 your changes.

That's it. Changes you make in Bookingmood now show on your website automatically.

## [FAQ](#faq)

### [Why does the calendar look cut off in the editor?](#why-does-the-calendar-look-cut-off-in-the-editor)

The TeleportHQ editor doesn't size embedded widgets correctly. Publish your site and check the calendar there; it should display normally.