Sport- & Wellnesshotel Allgäu Sonne (GV489340), Platform 1.0 on C02, embedded the same way as on arthotel-bakker.de: the bundle without -v2-, no es5 tag. This is how the embed on allgaeu-sonne.de should look.
Expected: the calendar must show prices, restriction icons and SOLD-OUT.
| Hotel code | GV489340 |
| Loaded bundle | gauvendi-widget-es2015.js |
Custom Element gauvendi-widget | checking … |
| Bundle from CDN | checking … |
Stylesheet styles.css | checking … |
GraphQL services.gauvendi.com/graphql | checking … |
REST services.gauvendi.com/calendars/sellability (expected to fail) | checking … |
Add these three lines to the website body.
<link rel="stylesheet" href="https://widget-cdn.gauvendi.com/v2/styles.css"> <script src="https://widget-cdn.gauvendi.com/v2/gauvendi-widget-es2015.js"></script> <gauvendi-widget hotel-code="GV489340" locale="de" booking-src="GVWEBWID"></gauvendi-widget>
Optional: larger text. A hotel that wants the widget more readable can add this to its own site CSS. It enlarges the search bar only, not the page; the calendar popup opens in the page body and keeps its size. Desktop only: on a phone the widget already fills the width and zoom pushes it past the edge.
@media (min-width: 1400px) { gauvendi-widget { zoom: 1.25; } }
@media (min-width: 1025px) and (max-width: 1399px) { gauvendi-widget { zoom: 1.1; } }
Optional: compact search bar. Hides the booking code field and shows only the magnifier on the search button. The class names are internal to the widget and can change with a widget update.
gauvendi-widget .promotion-wrapper,
gauvendi-widget .promotion { display: none !important; }
gauvendi-widget .action-wrapper-large .action-text { display: none !important; }