> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.aloha.co/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).
# ¿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:**
[](https://downloads.intercomcdn.com/i/o/qn4880pe/1356350140/8e1a1aedc0bc854ffbea5be01819/Captura+de+pantalla+2025-01-27+a+la%28s%29+16_09_51.png?expires=1752703200&signature=f74c12077db5363b14dfd30574e2128d2ed88d18feca92fa439ca6ec93b37535&req=dSMiEMp7nYBbWfMW1HO4zbnZQydMeyngL%2FHvWEA0sUhf5UKvnfElqKQzwBlE%0AgdeMUg9iWM%2Bbk8BNm0c%3D%0A)
## 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:**
**__**
[](https://downloads.intercomcdn.com/i/o/qn4880pe/1356431019/1c8d2136511a9f52750baadb3d73/Captura+de+pantalla+2025-01-29+a+la%28s%29+11_25_40.png?expires=1752703200&signature=2bf62fb18443ecb569a7f74957a9842ebf9a59821fe4a0e73467767398b337c3&req=dSMiEM19nIFeUPMW1HO4zatsqlNEXkLOrwk6y3F94aOtOECkysjT7cF3Ki7C%0AVHSkRI0OCVAmUzifvgE%3D%0A)
## 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_.
[](https://downloads.intercomcdn.com/i/o/qn4880pe/1356391445/0f75d098296267a8f56cb6f04b8c/Captura+de+pantalla+2025-01-29+a+la%28s%29+10_58_28.png?expires=1752703200&signature=78d1ceae9600a24913b87d977d1d1dd5977e7d5a790354a228775b254a68ca8d&req=dSMiEMp3nIVbXPMW1HO4zYO2pMxvA5reLP7UO4BgRyM3E5b%2FCfINd9zkgXHz%0AphlDys8TuMn6%2Bnh22sc%3D%0A)
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.
[](https://downloads.intercomcdn.com/i/o/qn4880pe/1356408781/406f5b20d87803d4bf846e2b8e89/Captura+de+pantalla+2025-01-29+a+la%28s%29+11_09_06.png?expires=1752703200&signature=0ba4486fa1e2c168a47ceaf516a3f606251dece90936f56a8dffd4a17299b7bd&req=dSMiEM1%2BlYZXWPMW1HO4zV9lN0yicoXmijNF2CvH76M%2FpXWWpM0l4UMnJ4%2Bg%0AGfyUGFxRZ1VGdbvqmSE%3D%0A)
## 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:**
__