The RESnWEB online booking system and its modules can be embedded into the accommodation’s website to provide a consistent, design-integrated user experience for the visitors who wants to make a reservation, seemingly running on its own URL. The interface also can be used on its external URL.
Preconditions for embedding
The domain has a valid SSL certificate
The accommodation’s identifier and the embedding key are available to insert the code
May result in malfunction:
Compressing the code
Not using an SSL certificate
Use of another URL than the one agreed with the support team
(e.g.: https://example.com/booking instead of https://example.com/online-booking)Invalid embedding key
Incorrect accommodation identifier
Embedding
In case of embedding, the code generated in RESnWEB extranet must be inserted after the opening <body> tag of the HTML document. The iframe is wedged into the DOM immediately after the inserted code, so the insertion point can be an important aspect.
The code generated in the “For web developers” menu item of the RESnWEB extranet looks like this:
Embed code sample
<script src="https://nethotelbooking.net/embed.RESnWEB.js?id=SAMPLE"></script>
Mobile devices
The survey page is optimised for mobile devices with a display width of at least 320 pixels. For a correct display, it is recommended to ensure that the embedded interface can be displayed in full screen width on these devices. This may require setting the padding and margin CSS properties of the HTML element containing the embed code to 0 for smaller displays.
Parameters you can enter
The "For web developers" menu allows you to set the number of comments displayed at the time of loading and the number of additional comments displayed.
1.) Number of comments displayed when loading. By default, 5 comments are loaded.
2.) Number of additional comments displayed. Clicking on the More reviews button will also display 5 comments by default.
3.) Default language of Survey page.
Troubleshooting
Check that the accommodation ID and embed key are correct
When embedding within a content management system (CMS), it is worth using the browser's developer toolbar to make sure that the structure of the code you are pasting is compliant (the variable names are correct, the remote JavaScript file reference is correct).
Check, using the browser's development tools, that no errors occurred while the program was running.
Use of sticky header
The sticky header on the website hides relevant information and functionality from our interfaces, so please make the following setting, which will allow the interface to take into account the height of the header and display the page content below it.
In the RESnWEB extranet, there is an option to set the fixed header in the "For Web developers" menu item.
You can use ID, class, and attributes as well.
E.g. #sticky-headers, .sticky-headers
IMPORTANT! HTML tag cannot be specified.
Example of an embedded survey page:
