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

![Framer](https://ksxynoprjyugtwuaqdho.supabase.co/storage/v1/render/image/public/website/covers/e97b6666-8b85-4b58-b9f3-1c56314389ec.png?quality=75&resize=contain&width=640)

# Framer

Add Bookingmood booking calendars to your Framer website

[Документация](https://www.bookingmood.com/bg-BG/docs/channels/widgets) [framer.com](https://framer.com/) ✓ Наличен

Add Bookingmood to your [Framer](https://www.framer.com/) 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 _oEmbed_ link. You need it in the next step.

## [Add the widget to Framer](#add-the-widget-to-framer)

Framer has its own _Embed_ block, but it doesn't resize with the widget. Use the Bookingmood component instead:

- Copy the URL of the component: `https://framer.com/m/BookingmoodWidget-2LUx.js`
- In the Framer editor, right-click the page where you want to place the widget and click _Paste_.
- In the sidebar, under _BookingmoodWidget_, paste the oEmbed link into the _url_ field.

![The Bookingmood widget embedded in a Framer site](https://ksxynoprjyugtwuaqdho.supabase.co/storage/v1/render/image/public/public/-971fff2b-241f-47cc-b8e1-6df11bed47bd.png?quality=75&resize=contain&width=3840)

- Set the layout type of the surrounding section to _Stack_, so the page adjusts as the widget changes height.

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