CTA: Botones HTML para reservar - Generador de Elementos HTML para Reserva

CTA: Botones HTML para reservar - Generador de Elementos HTML para Reserva

Elementos HTML, Botones para Reservar – Llamadas de Acción dentro de la página Web

Si ya instaló hotelrsv.js (ver guía de instalación), solo agregue la clase class=”rsv-app-launcher rsv-mobile-launcher” a cualquier elemento HTML en su página y listo, esta clase activará funciones JavaScript automáticamente y abrirá el motor de reservaciones de HOTELRSV.   
Ejemplo: 
  1. <button class="rsv-app-launcher rsv-mobile-launcher otras-clases">

Botones de reservar dentro de la Pagina Web del Hotel

La librería hotelrsv.js es la encargada de integrar los varios productos de hotelRSV como el Widget, la App Web y la App Mobile y las funcionalidades de Conexión con TripAdvisor con TripConnect y de Search Engine Call to Reservation with Sitelinks.

Para colocar botones de “Reserve Ahora” el procedimiento es muy sencillo, además existen varias opciones de customización. La siguiente guía está orientada para el Webmaster de su página Web y explica cómo configurar correctamente los botones de Reservar (call to action).

Requerimientos previos


Requerimiento
Nota
Librería Instalada hotelrsv.js
Instalación de hotelrsv.js antes de la etiqueta </head> o </footer> en cada página donde deseen colocar botones de reservas, vea la  sección de instalación.
Código de Licencia hotelrsv_id_##
Asignación de la variable de hotel o del hotel principal en caso de hoteles de Grupo. Esta información le será proporcionada al momento de la activación del servicio.
Código de Página  analytics.novohit.com
Asignación del ID de página de analytics.novohit.com .

Clases rsv-app-launcher y rsv-mobile-launcher


Configuración de botones para Aplicación Web
Cualquier botón, imagen o link (anchor) ubicado en la página web del hotel, puede usarse para lanzar la aplicación de reservaciones de hotelRSV, para esto solo se requiere agregar la clase rsv-app-launcher al botón o link en el que requiera dicha acción. Esta clase no agrega ningún estilo, es puramente funcional.
El atributo class debe ser el último atributo. Nuestro generador de botones ya contempla esta situación.
Para adicionar clases en menús de WordPress, seguir esta guía.

Elementos HTML soportados

Los tipos de botones a los que se les puede agregar la clase, son:

Elemento de Acción
Ejemplo
<button>
<button class="rsv-app-launcher rsv-mobile-launcher otras-clases">
<input>
<input class="rsv-app-launcher rsv-mobile-launcher otras-clases">
<a>
<a class="rsv-app-launcher rsv-mobile-launcher otras-clases">
<input type="button">
<input type="button" class="rsv-app-launcher rsv-mobile-launcher otras-clases">
Si ya existe el atributo class dentro de su elemento HTML, debe dejar un espacio antes de agregar las clases de hotelrsv: rsv-app-launcher rsv-mobile-launcher
Hemos facilitado un Generador de Botones en el siguiente link. Antes de usar el Generador de Botones, lea la siguiente guía.

Selección de Idioma

hotelRSV es multi idioma y automáticamente se mostrará en el idioma del usuario (según el idioma en el que esté su dispositivo). Para detalles, vea Selección y Determinación del Idioma.
Es posible modificar el idioma de hotelRSV a nivel programático a nivel global (para todos los elementos de Acción en la página) o a nivel singular (por cada Botón de Reserva o Elemento de Acción), para mas información, vea  Selección y Determinación del Idioma .

Parámetros Adicionales

En algunos CMS como WordPress, los parámetros adicionales que comiencen con el prefijo data-hotelrsv-XYZ deben ir antes de cualquier otro atributo, mientras que el atributo class debe ser el último atributo. Nuestro generador de botones ya contempla esta situación.

Parámetro
Posibles Valores
Uso
Explicación
data-hotelrsv-lang
Código ISO 3166-2 de dos caracteres. Ver listado en Selección y Determinación del Idioma.
Opcional.
Selección de idioma, si no se pasa este parámetro, tomará el idioma establecido según explicado en   Selección y Determinación del Idioma .
data-hotelrsv-currency-code
Código de Moneda ISO 4217 según las monedas configuradas en su Hotel.
Opcional.
Código de Moneda a pre-seleccionar.
Debe usar los códigos ISO 4217 que estén dados de alta en su extranet.
Revisar en su panel de control / extranet.
Si tiene dudas, coloque un ticket .
data-hotelrsv-dt-arrival
Fecha en formato AAAAMMDD
Opcional.
AñoMesDia que representa la fecha de check-in deseada.
data-hotelrsv-dt-departure
Fecha en formato AAAAMMDD
Opcional.
AñoMesDia que representa la fecha de check-out deseada.
data-hotelrsv-id-room-type
Identificador de la habitación o producto según los tipos de habitaciones o paquetes configurados en su hotel.
Opcional.
Si usa room_type_abbrev no debe usar este parámetro.
Identificador de la habitación a pre-seleccionar.
El ID lo encuentra en su panel de control / extranet.
Si no sabe como obtener el id de habitación, utilice el parámetro room_type_abbrev a continuación.
Si está usando los parámetros dt_arrival y dt_departure debe incluir este parámetro.
data-hotelrsv-room-type-abbrev
Identificador alfanumérico personalizable de la habitación o producto según los tipos de habitaciones o paquetes configurados en su hotel.
Opcional.
Si usa id_room_typeno debe usar este parámetro.
Identificador de la habitación a pre-seleccionar.
El ID lo encuentra en su panel de control en Configuraciones → Configuración Operaciones → General → Tipo y Fotos de Habitación
en el campo ABREVIATURA
Más información sobre este campo en Tipos de Habitación  
Si está usando los parámetros dt_arrival y dt_departure debe incluir este parámetro.
La abreviación NO puede contener espacios, acentos, letras con tildes, caracteres especiales ni puntuación. Solo caracteres alfanuméricos.
Si está usando los parámetros dt_arrival y dt_departure debe incluir este parámetro.
data-hotelrsv-show-other-rooms
1 | 0
Opcional.
1 = Mostrará otras habitaciones además de la pre-seleccionada.
0 = Mostrará únicamente la habitación pre-seleccionada.
data-hotelrsv-id-hotel
Id del Hotel en un grupo de Hoteles
Opcional.
Solo para grupos de Hoteles
Use este parámetro si su página es para varios hoteles de un grupo pero desea que un botón de reserva ejecute la app de reservas para un botón particular.
data-hotelrsv-promo-code
Código promocional de Splendidus Generador de Prómos
Opcional.
El código lo encuentra en el panel de control en
Ventas → Define Promociones
data-hotelrsv-show-multihotel-selector
Desplegar el selector de hoteles (solo grupos de hoteles)
Opcional.
Solo para grupos de Hoteles
data-hotelrsv-show-multihotel-selector="1"
Si tiene dudas, coloque un ticket.

Ejemplos

En los siguientes ejemplos, los elementos de acción llamarán a la Aplicación en el idioma declarado a nivel global ya que no tienen declarado el atributo para determinación a nivel singular de idioma.

Ejemplos de Input

  1. <input type="submit" value="Reservar" class="rsv-app-launcher rsv-mobile-launcher">

Ejemplo de Input Tipo Botón

  1. <input type="button" value="Reserve" class="rsv-app-launcher rsv-mobile-launcher" data-hotelrsv-show-multihotel-selector="1">
Este código hará que se muestre el selector de hoteles apenas se inicie la app. Solo aplíquelo si el hotel o la página permite reservas para un grupo de hoteles.

Ejemplo de Input Tipo Botón

  1. <a href="#" class="rsv-app-launcher rsv-mobile-launcher" data-hotelrsv-promo-code="MYPROMO15">

Ejemplos de Botón

  1. <button data-hotelrsv-lang="en" class="rsv-app-launcher rsv-mobile-launcher" >Reserve</button>
El siguiente ejemplo ejecutará la aplicación en Inglés, independientemente del idioma indicado a nivel global.

  1. <a data-hotelrsv-lang="en" data-hotelrsv-room-type-abbrev="SGLLUX" data-hotelrsv-promo-code="MYPROMO15" data-hotelrsv-dt-arrival="20241010" data-hotelrsv-dt-departure="20241013" data-hotelrsv-show-other-rooms="0" href="#" class="mibtn miClase rsv-app-launcher rsv-mobile-launcher">Reservar</a>
El siguiente ejemplo ejecutará la aplicación:
- En Ingles data-hotelrsv-lang="en"
- Pre-seleccionando las fechas del 10 al 13 de octubre del 2024 data-hotelrsv-dt-arrival="20241010" data-hotelrsv-dt-departure="20241013"
- Cargará el cupón MYPROMO15 data-hotelrsv-promo-code="MYPROMO15"
- Mostrará sólo el tipo de habitación SGLLUX sin mostrar otros tipos de habitaciones data-hotelrsv-room-type-abbrev="SGLLUX" y data-hotelrsv-show-other-rooms="0"

Adicionar Atributos (parámetros de hotelRSV) en Elementor

Generador de elementos HTML (botones) para abrir el motor de reservas en la página web 

Esta aplicación no substituye la guía de instalación y es responsabilidad del Hotel o del WebMaster verificar que el código generado por el Generador de Botones sea compatible con la pagina Web del Hotel.




    • Related Articles

    • CTA: URLs, Links Directos para reservar - Generador de Links de Reserva

      CTA: Call to Action a través de URLs o Links Directos (deeplink) para reservar Esta guía está orientada para generar crear “incoming links” para ser usados en Newsletter (mail-list), compartir en redes sociales, chat, y otras formas de comunicación ...

    • Condiciones para Reservar

      Condiciones para Reservar Se recomienda que en lugar de poner el texto de las condiciones, solamente indiquen el Link hacia su pagina Web con todas las condiciones universales. Ejemplo: Todas las condiciones de reservaciones se encentran en: ...

    • Garantías para Reservar

      Para modificar los textos, el título y el estatus de activación de una Garantía deberá seleccionar: Configuraciones → General → Garantías para Reservar En la pantalla podrá ver dos secciones: Sección Garantías para Reservar Habitaciones en esta ...

    • Guía de Instalación hotelrsv.js

      hotelRSV es una aplicación 100% web creada con HTML, JS, CSS que se puede instalar rápidamente en cualquier página sin necesidad de saber programación. Puede instalarlo en cuaquier CMS (Drupal, Joomla, Wordpress, Wix, SquareSpace), o en cualquier ...

    • Uso del parámetro lead_src para estadísticas de orígenes

      El parámetro lead_src puede ser usado en para hacer rastreo de campañas en analytics.novohit.com (parecido a las campañas de Google Analytics) y obtener estadísticas de uso en algunos reportes de HotelRSV. lead_src en analytics.novohit.com lead_src y ...