Onetbooking

Tema

Instalar la página ​

Los resultados con las habitaciones disponibles, sus precios y otras características se muestran en páginas dentro de la propia web del hotel. Para insertarlo se necesitan configurar varias páginas en direcciones concretas:

  1. Página de disponibilidad.
  2. Página de extras.
  3. Página de política de privacidad.
  4. Página de términos de uso.

Directrices previas ​

Las páginas están pensadas para mostrar los resultados de la búsqueda. Son críticas para el funcionamiento y rendimientos monetarios correctos del motor por lo que deben cumplirse una serie de directrices.

  1. Sin elementos emergentes: Que no exista ningún elemento emergente que se superponga. Desactivarlos todos. Que no haya chats, que no haya suscripciones a la newsletter, etc.
  2. Solo cabecera y pie: Que contenga el menú o cabecera común a toda la web y el pie común a toda la web; pero ninguna barra lateral ni contenido.
  3. Sin imágenes de cabecera: Que no tenga imágenes excesivamente grandes al principio de la página. Aquí no quedan bonitas y son un estorbo durante la reserva provocando además un scroll innecesario. La cabecera debe contener solo el menú y los datos esenciales comunes a la web.
  4. Sin limitación de ancho: El contenido de la página no debe ir limitado en ancho. Es muy común encontrar contenedores que centran el contenido y lo limitan pero el motor tiene su propio funcionamiento que se vería afectado por esto.
  5. No insertar el widget en las páginas del motor: El motor tiene funcionalidad propia que tienen todo lo necesario. No insertes el widget dentro de las páginas del motor.
  6. No mostrar el widget móvil en el menú: Recuerda no mostrar el link o botón de reservar móvil que tengas en el menú de navegación dentro de las páginas del motor.

Página de disponibilidad ​

Dirección URL ​

Una vez revisemos las directrices previas debemos insertar una página de disponibilidad por cada idioma que tengamos configurado en el motor. El idioma viene indicado según el script que hayamos cargado previamente para el widget. Cada idioma del widget manda la disponibilidad a la página correspondiente con el mismo código.

La dirección de las páginas de disponibilidad deben ser exactamente la siguiente. No puede cambiar y no se puede redireccionar a ninguna otra.

https://[WEB DEL HOTEL]/[LANG]/availability

Por ejemplo si la web del hotel es www.hotel.com estas serían las direcciones de algunos lenguajes comunes:

html
https://www.hotel.com/es/availability
html
https://www.hotel.com/en/availability
html
https://www.hotel.com/fr/availability

Consulta el listado completo de idiomas soportados.

Una página por idioma

Recuerda insertar una página por cada idioma en el que configures el widget.

Script ​

Dentro de la página debemos cargar el mismo script que teníamos para el widget con el lenguaje de cada dirección. Dependiendo del código de idioma el script será:

html
<script type="module" src="https://engine.onetbooking.com/[LANG]/script.js"></script>

No cargues un idioma en otro

Ten cuidado para cargar el script correcto dentro de cada lenguaje. Si la página utiliza el lenguaje es-es carga el script es-es, NO cargues ningún otro como es o en, aunque sean dialectos parecidos o te parezca buena idea.

Contenido ​

El contenido de la página debe tener únicamente la siguiente etiqueta:

html
<onetbooking-page></onetbooking-page>

No limites el ancho

Recuerda no limitar el ancho ni meter la etiqueta dentro de un contenedor centrado de ningún tipo.

Si el diseño de tu sitio web tiene una barra flotante que acompaña a la pantalla recomendamos que utilices la etiqueta <nav> para envolver el contenido de esa barra. Esta solución es semántica, correcta y la detecta automáticamente el motor para ajustar los flotantes dentro de las pantallas.

Si por razones de fuerza mayor se tienen que usar otras etiquetas o estructura primeramente intenta forzar utilizar la etiqueta <nav>. Es la mejor solución y la más sencilla y compatible. Si aún así no es posible se puede configurar un selector CSS personalizado para indicar cual es el elemento flotante de la página.

Otros flotantes

Para indicar el elemento flotante configura un selector CSS como atributo en la etiqueta:

html
<onetbooking-page navbar=".my-custom-navbar"></onetbooking-page>

Página de extras ​

Dirección URL ​

Volvemos a repetir los mismos pasos que la disponibilidad para diseñar una pantalla de extras en la dirección:

https://[WEB DEL HOTEL]/[LANG]/extras

Por ejemplo si la web del hotel es www.hotel.com estas serían las direcciones de algunos lenguajes comunes:

html
https://www.hotel.com/es/extras
html
https://www.hotel.com/en/extras
html
https://www.hotel.com/fr/extras

Añade siempre esta página

Incluso aunque no se planeen configurar extras en el hotel esta página es totalmente necesaria y obligatoria crearla siempre.

Script ​

El mismo script que en toda la web:

html
<script type="module" src="https://engine.onetbooking.com/[LANG]/script.js"></script>

Contenido ​

El mismo contenido que tenía la página de disponibilidad:

html
<onetbooking-page></onetbooking-page>

Política de privacidad ​

El motor necesita tener una URL válida dentro del hotel donde mostremos la política de privacidad. Las URLs dependen del idioma del motor y tienen esta forma:

https://[WEB DEL HOTEL]/[LANG]/privacy-policy

Por ejemplo si la web del hotel es "www.hotel.com" estas serían las direcciones de algunos lenguajes comunes:

html
https://www.hotel.com/es/privacy-policy
html
https://www.hotel.com/en/privacy-policy
html
https://www.hotel.com/fr/privacy-policy

Pueden redireccionar

No hace falta que implementes el contenido en esa dirección concreta, puedes redireccionar a la URL que más te convenga en cada caso. Tienen que existir porque será donde acceda el usuario para consultar la política de privacidad.

El contenido de las páginas y sus redirecciones queda totalmente en libertad de lo que necesite el hotel.

Términos de uso ​

Similar a la página de política de privacidad el motor necesita tener otra página donde mostremos los términos de uso. Las URLs dependen del idioma del motor y tienen esta forma:

https://[WEB DEL HOTEL]/[LANG]/terms

Por ejemplo si la web del hotel es "www.hotel.com" estas serían las direcciones de algunos lenguajes comunes:

html
https://www.hotel.com/es/terms
html
https://www.hotel.com/en/terms
html
https://www.hotel.com/fr/terms

Pueden redireccionar

No hace falta que implementes el contenido en esa dirección concreta, puedes redireccionar a la URL que más te convenga en cada caso. Tienen que existir porque será donde acceda el usuario para consultar los términos de uso.

El contenido de las páginas y sus redirecciones queda totalmente en libertad de lo que necesite el hotel.