This article explains how to change the Room Dropdown menu options for your Cloudbeds Booking Engine.
Overview
There are certain properties that only have one room within a room type/category. When the guest tries to make a reservation on the booking engine, they will need to select 0 or 1 from the drop-down menu under Rooms to trigger the Book Now button and proceed with the reservation.
Since this situation can be confusing for guests, the steps below explain how to change these numbers and add Yes or No instead.
- This solution is only applicable/recommended for properties that have only one room in a room type
- Once you add the customized codes of this article, they will be applied to all your room types on the booking engine.
- Copy the following code and paste it under Custom footer for your hotel booking page section to exclusively change the Room Dropdown menu options from 0 to No and from 1 to Yes.
- Save your changes
- Replicate the steps for the required languages
<script>
function deferLoadingJQuery() {
if (window.jQuery) {
// Initial page.
setInterval(function() {
if ($(".av-room-details .basic_prices").get(0)) {
// Change '0' to No and '1' to Yes
$(".several_rows select.bs-select-hidden option").each(function() {
$(this).html($(this).html().replace("0", "No"));
$(this).html($(this).html().replace("1", "Yes"));
});
$(".several_rows .bootstrap-select.btn-group .dropdown-menu span.text").each(function() {
$(this).html($(this).html().replace("0", "No"));
$(this).html($(this).html().replace("1", "Yes"));
});
$(".several_rows .bootstrap-select.btn-group .dropdown-toggle span.filter-option.pull-left").each(function() {
$(this).html($(this).html().replace("0", "No"));
$(this).html($(this).html().replace("1", "Yes"));
});
}
}, 500);
} else {
setTimeout(function() { deferLoadingJQuery(); }, 50);
}
}
deferLoadingJQuery();
</script>
Change the drop-down menu wording from Rooms to Select this room? or Continue? instead. This can avoid any confusion for the guests while making a reservation on the booking engine.
Add the code below under Custom Meta Tags section and replace YOUR TEXT HERE with the desired text:
<style>
.av-room-options .no-rooms .type_of_room {
font-size: 0 !important;
}
.av-room-options .no-rooms .type_of_room:after {
content: "YOUR TEXT HERE";
text-align: center;
font-size: 11px;
}
</style>
If the code is not working when you switch the booking engine language, refer to this article for further information.
