Appearance
Widget embebible ​
El widget de SolNow es un componente web que podés incrustar en tu sitio web para que los clientes consulten disponibilidad y reserven directamente. Las reservas del widget se sincronizan automáticamente con tu dashboard.
¿Qué puede hacer el cliente desde el widget? ​
- Ver las experiencias disponibles con fotos, descripción y precios
- Seleccionar fecha, número de personas y extras
- Ver la disponibilidad en tiempo real
- Completar el pago con tarjeta (Stripe, VIVA Wallet o Redsys)
- Recibir confirmación de la reserva por email
Configurar el widget en el dashboard ​
1. Acceder a la configuración ​
Ir a Configuración → Widget en el menú lateral.
2. Opciones de configuración general ​
| Opción | Descripción |
|---|---|
| Experiencias visibles | Seleccioná cuáles experiencias aparecen en el widget. Podés mostrar solo algunas aunque tengas más configuradas. |
| Idioma | Idioma predeterminado del widget (español, inglés, etc.) |
| Colores | Color principal y de acento del widget para que coincida con tu marca |
| Moneda | Moneda de los precios mostrados |
| Dominio autorizado | Dominio(s) donde el widget está permitido (ej. tu-empresa.com) |
3. Configuración por experiencia ​
Desde el detalle de cada experiencia (Configuración → Experiencias → [nombre]) podés configurar cómo aparece esa experiencia en el widget:
- Activar/desactivar en el widget: toggle para incluir o excluir la experiencia
- Badge de imagen: Ãcono superpuesto sobre la foto (posición y tamaño configurables)
- URL Slug: define la URL directa de la experiencia en el widget (ej.
/booking/kayak-tour) - Video: embed de YouTube o Loom con el video de presentación
- HTML personalizado: descripción enriquecida con HTML en la página de la experiencia
4. Obtener el código de integración ​
- Ir a Configuración → Widget
- En la sección Código de integración, copiar el snippet de código
El código tiene este formato:
html
<script
src="https://widget.solnow.io/embed.js"
data-organization="TU_ORG_ID"
defer
></script>
<div id="solnow-widget"></div>Instalar el widget en tu web ​
En cualquier sitio web (HTML puro) ​
Pegá el snippet antes del cierre de </body> en la página donde querés mostrar el widget:
html
<!DOCTYPE html>
<html>
<head>...</head>
<body>
<!-- Tu contenido existente -->
<!-- Widget de SolNow -->
<script
src="https://widget.solnow.io/embed.js"
data-organization="TU_ORG_ID"
defer
></script>
<div id="solnow-widget"></div>
</body>
</html>En WordPress ​
- Ir al editor de la página donde querés el widget
- Agregar un bloque de tipo HTML personalizado
- Pegar el snippet del widget
- Publicar la página
Alternativamente, podés usar el plugin Insert Headers and Footers para agregar el script globalmente.
En Wix ​
- Ir al editor de Wix
- Hacer clic en + Agregar → Embed → HTML personalizado
- Pegar el código del widget
- Ajustar el tamaño del bloque
En Squarespace ​
- Ir al editor de bloques
- Agregar un bloque de tipo Code
- Pegar el snippet
Flujo de reserva desde el widget (vista del cliente) ​
El cliente ve el siguiente proceso al reservar desde tu sitio:
Paso 1 — Seleccionar experiencia ​
El widget muestra una galerÃa con todas las experiencias activas: foto, nombre, precio base y duración. El cliente hace clic en la que le interesa.
Paso 2 — Elegir fecha y personas ​
Se muestra un selector de fecha con disponibilidad en tiempo real. Las fechas sin disponibilidad aparecen deshabilitadas. El cliente elige cuántas personas adultas y menores van.
Paso 3 — Seleccionar horario y polÃtica ​
Si la experiencia tiene múltiples polÃticas (ej. "con patrón" / "sin patrón", o distintos horarios), el cliente elige cuál le conviene. El sistema muestra el precio actualizado.
Paso 4 — Agregar extras ​
Aparecen los extras configurados para la experiencia (patrón, combustible, seguro, etc.) con sus precios. El cliente puede agregarlos o no.
Paso 5 — Datos del cliente ​
Formulario con nombre, email, teléfono y el número de personas confirmado. Si tu organización tiene campos personalizados en el formulario, también aparecen aquÃ.
Paso 6 — Pago ​
El widget redirige al proceso de pago según el proveedor configurado (Stripe, VIVA Wallet o Redsys). El cliente ingresa los datos de su tarjeta en un entorno seguro.
Paso 7 — Confirmación ​
Al completar el pago, el cliente ve una pantalla de confirmación con los detalles de la reserva y recibe un email de confirmación.
Resultado en el dashboard ​
Cada reserva completada desde el widget genera automáticamente:
- Un lead con los datos del cliente (estado: Confirmado)
- Una reserva (instancia de experiencia) vinculada al lead
- Una factura en borrador con el importe pagado
- El pago registrado en la pasarela configurada
Podés ver el lead recién creado en Leads → filtrar por "Widget" en el origen.
Personalización avanzada ​
Widget de una sola experiencia ​
Si querés que el widget muestre directamente una experiencia especÃfica (sin la galerÃa de selección), agregá el parámetro data-experience:
html
<script
src="https://widget.solnow.io/embed.js"
data-organization="TU_ORG_ID"
data-experience="alquiler-kayak"
defer
></script>
<div id="solnow-widget"></div>Coupons de descuento ​
Podés crear códigos de descuento desde Configuración → Cupones. Los clientes pueden ingresarlos en el paso de pago del widget. Ver configuración de cupones para más detalles.
Consejo
Para que el widget funcione correctamente, el dominio de tu sitio web debe estar en la lista de dominios autorizados en Configuración → Widget → Dominios. Si el widget no carga, verificá este ajuste primero.
Atención
El widget procesa pagos reales. Asegurate de completar la configuración de la pasarela de pago antes de embeber el widget en tu sitio en producción. Podés usar el entorno de pruebas de Stripe para testear el flujo sin cobrar tarjetas reales.