¿Cómo configuro mi widget en mi página web?

Pasos para instalar el widget en tu página web

El widget de Aloha te permite integrar fácilmente el sistema de reservas en tu página web, ofreciendo a los clientes una forma rápida y sencilla de reservar sus estadías. Su instalación es simple y no requiere conocimientos avanzados de programación.

A continuación, te explicamos paso a paso cómo agregarlo a tu sitio web.

Paso 1 - Agrega el archivo de estilos

Para que el widget se vea correctamente, es necesario incluir el archivo de estilos en tu página web.

📌Copia y pega el siguiente código dentro de la etiqueta de tu archivo HTML:

<link rel="stylesheet" href="[https://booking-widget.aloha.co/aloha-booking-widget.css"/](https://ayuda.alojate.pro/'%20rel=)>

Paso 2 - Agrega el contenedor del widget

Este contenedor es el espacio donde se cargará el widget dentro de tu sitio web.

📌 Copia y pega este código antes de la etiqueta de cierre de tu archivo HTML:

Paso 3: Asignar un ID único al botón para abrir el widget

Para que el widget se abra cuando se haga clic en un botón específico, primero debes asignarle un ID único. En Elementor, puedes hacerlo fácilmente de la siguiente manera:

1. Abre el editor de Elementor y selecciona el botón que deseas que abra el widget.
2. En la barra lateral izquierda, ve a la sección “Contenido”.
3. En el campo “ID del bóton”, asigna un ID único al botón. Por ejemplo, usa btn-widget.

Este ID es esencial para vincular el botón con el script que abrirá el widget de reservas.

Paso 4 - Obtener la clave secreta de la propiedad y agregar el script

La clave secreta de la propiedad es necesaria para autenticar el widget en tu página. Para obtenerla, sigue estos pasos:

Obtén la clave secreta de la propiedad en el sistema Aloha:

1. Ve a Administrar Sistema en tu panel de administración.
2. Luego, selecciona Widget.
3. Allí verás la “Llave de identificación de tu propiedad”. Esta es la clave que necesitas copiar.

Paso 5 - Agregar el script del widget y configurarlo

Una vez que hayas asignado el ID al botón, ahora debes agregar el script que cargará y abrirá el widget cuando se haga clic en el botón. Este código se inserta antes de la etiqueta de cierre de tu archivo HTML.

📌 Copia y pega este código en el área correspondiente:

_

Con esto, cuando tus huéspedes hagan clic en el botón con el ID btn-widget, el widget de Aloha se abrirá correctamente.

Asegúrate de reemplazar 'TU_CLAVE_SECRETA_AQUI' con la clave secreta de tu propiedad que obtuviste en el sistema.

Actualizado el: 16/07/2025