---
title: Room Type Widget
slug: room-type-widget
createdAt: 2020-11-26T14:24:44.000Z
---

:::Iframe{iframeHeight="0" code="<room-type hotel=d2c884c4cc room-type=ffc46611-4b3f-4e32-9388-7c83af8e6077 locale=de>"}

:::

```html
<script src="https://hmwidgets.web.app/shadow/js/app.js" type="application/javascript"></script>

<room-type hotel="d2c884c4cc" room-type="ffc46611-4b3f-4e32-9388-7c83af8e6077" locale="de">
```

## Options

| Attribute             | Description                                                                                                                                     | Default |
| --------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------- | ------- |
| hotel                 | Hotel ID (required)                                                                                                                             |         |
| room-type             | if a valid room-type ID is supplied only this room type is shown<br />if no room-type ID is supplied all rooms are rendered                     |         |
| booking-button        | `true` shows the booking button<br />`false` hides the booking button                                                                           | `true`  |
| availability-calendar | `true` shows the availability calendar<br />`false` hides the availability calendar                                                             | `true`  |
| flip                  | `true` shows the images on the right and the description on the left<br />`false` shows the images on the left and the description on the right | `false` |
| background            | background color to be used for the room type row<br />any valid CSS color can be supplied - e.g. `#eeeeee` or `rgb(230,230,230)`               |         |