Integracion web

Categoria: Marketing | Codigo: website_integration

Con la Integracion web puedes insertar widgets de Bookicorn directamente en tu propio sitio web. Los clientes pueden reservar clases, comprar creditos y canjear vales – sin salir de tu sitio web. Los widgets se adaptan automaticamente a los colores y logotipo de tu estudio.

Que incluye

• Constructor de widgets con configuracion mediante arrastrar y soltar
• 5 tipos de widget: Horario de clases, formulario de reserva, paquetes de creditos, canje de vales, informacion del estudio
• Marca automatica: Los widgets adoptan automaticamente los colores y el logotipo de tu estudio
• Insercion via iframe o etiqueta script – funciona en cualquier sitio web
• Diseno responsive – se ve genial en escritorio y movil
• Sin necesidad de programar – copiar y pegar es todo lo que necesitas

Activacion

Constructor de widgets

El Constructor de widgets es la herramienta central para tu integracion web. Configuras que widgets quieres insertar y como deben verse.

Como funciona

Vista previa en vivo

En el lado derecho del Constructor de widgets ves una vista previa en vivo del widget – exactamente como aparecera en tu sitio web. Los cambios se muestran inmediatamente.

Widgets disponibles

1. Widget de horario de clases

Muestra tu horario de clases actual en tu sitio web. Los clientes pueden ver todas las clases con fecha, hora, entrenador y plazas disponibles.

Opciones de configuracion:

• Vista: vista semanal o vista de lista
• Filtros: tipos de clase, ubicaciones, entrenadores
• Rango de tiempo: semana actual, proximas 2 semanas, proximo mes
• Boton "Reservar ahora" directamente en el widget

<!-- Widget de horario de clases -->
<div id="bookicorn-schedule"></div>
<script src="https://widget.bookicorn.net/schedule.js"
  data-studio="tu-id-de-estudio"
  data-lang="es">
</script>

2. Widget de formulario de reserva

Un formulario de reserva completo para una clase o tipo de clase especifico. Los clientes eligen su horario, inician sesion y reservan – todo sin salir de tu sitio web.

Opciones de configuracion:

• Prefiltro a un tipo de clase especifico
• Prefiltro a una ubicacion especifica
• Visualizacion: ancho completo o compacta

Consejo: Usa el widget de formulario de reserva en landing pages de clases individuales. Una pagina dedicada por tipo de clase con un formulario de reserva directo convierte significativamente mejor que una vista general de clases.

3. Widget de paquetes de creditos

Muestra tus paquetes de creditos para compra directa. Los clientes pueden seleccionar y comprar paquetes sin tener que abrir la app de Bookicorn.

Opciones de configuracion:

• Que paquetes mostrar (todos o solo seleccionados)
• Visualizacion: cuadricula o lista
• Destacar un paquete (p. ej. "Mas popular")

4. Widget de canje de vales

Un formulario simple donde los clientes pueden introducir su codigo de vale. Tras introducir el codigo, se muestran las ofertas disponibles con el descuento aplicado.

Nota: El widget de canje de vales requiere el addon Sistema de vales.

5. Widget de informacion del estudio

Muestra informacion basica sobre tu estudio: direccion, horario de apertura, datos de contacto y un boton "Reservar ahora". Practico para la barra lateral o el pie de pagina de tu sitio web.

Marca automatica

Todos los widgets adoptan automaticamente la marca de tu estudio:

• Color principal: De la configuracion de tu estudio (para botones, enlaces, elementos destacados)
• Logotipo: El logotipo de tu estudio aparece en la cabecera del widget
• Fuente: Fuentes del sistema que funcionan bien con la mayoria de sitios web
• Bordes redondeados y espaciado: Optimizados para un aspecto moderno y limpio

Puedes actualizar tu marca en cualquier momento en la configuracion de tu estudio – todos los widgets se actualizan automaticamente.

Nota: El logotipo de Bookicorn no aparece en los widgets. Para una apariencia completamente de marca blanca sin ninguna referencia a Bookicorn, consulta el addon App movil (White Label).

Insercion en tu sitio web

Opcion 1: iframe (sencillo)

Para la mayoria de constructores de sitios web (Wix, Squarespace, Jimdo, etc.) el iframe es la opcion mas sencilla:

<iframe
  src="https://widget.bookicorn.net/[id-estudio]/schedule"
  width="100%"
  height="600"
  frameborder="0"
  style="border: none; border-radius: 12px;">
</iframe>

Opcion 2: Etiqueta script (recomendada)

Para WordPress, Webflow o paginas HTML personalizadas, la etiqueta script es la mejor opcion – el widget ajusta automaticamente su altura:

<!-- Contenedor del widget -->
<div id="bookicorn-widget"></div>

<!-- Script del widget -->
<script
  src="https://widget.bookicorn.net/loader.js"
  data-studio="[tu-id-de-estudio]"
  data-widget="schedule"
  data-lang="es"
  async>
</script>

Guias por plataforma

Diseno responsive

Todos los widgets estan optimizados para movil y se adaptan automaticamente al ancho de la pantalla:

• Escritorio (>768px): Vista completa con todas las columnas
• Tablet (480–768px): Diseno adaptado, visualizacion mas compacta
• Movil (<480px): Diseno de una columna, apilado verticalmente

No necesitas configurar nada – esto ocurre automaticamente.

Combinar varios widgets

Puedes insertar varios widgets diferentes en tu sitio web al mismo tiempo. Combinacion recomendada para una pagina de reservas optima:

Consejos para mejor conversion

Ubicacion destacada

• No escondas el widget – coloca el horario de clases en la pagina principal "above the fold" (visible sin desplazar)
• Enlaza una pagina de reservas dedicada en tu navegacion
• Haz que los botones de llamada a la accion en otras paginas apunten a la pagina de reservas

Llamadas a la accion claras

• Usa titulos orientados a la accion: "Reserva una clase ahora", "Asegura tu plaza"
• Coloca textos introductorios breves sobre el widget: ¿por que alguien deberia reservar ahora mismo?

Tiempo de carga

• La etiqueta script se carga de forma asincrona y apenas afecta al tiempo de carga de tu sitio web
• El iframe es ligeramente mas lento – prefiere la etiqueta script para sitios web criticos en rendimiento

Test A/B

Prueba diferentes ubicaciones y configuraciones de widgets:

• Widget de horario de clases arriba vs. paquetes de creditos arriba
• Vista semanal vs. vista de lista
• Con o sin filtro de entrenador

Preguntas frecuentes

¿Los widgets funcionan en todos los navegadores? Si. Los widgets soportan todos los navegadores modernos (Chrome, Firefox, Safari, Edge) e Internet Explorer 11+.

¿Los clientes necesitan una cuenta de Bookicorn para reservar? Si. En el proceso de pago, se solicita a los clientes que inicien sesion o se registren. El registro es gratuito y tarda menos de un minuto.

¿Se actualizan los widgets automaticamente cuando cambio el horario de clases? Si. Los widgets siempre muestran datos en tiempo real – los cambios de horario en la administracion son visibles inmediatamente en el widget.

¿Puedo insertar el widget en varias paginas al mismo tiempo? Si, sin restricciones. Puedes usar el mismo codigo de widget en tantas paginas como quieras.

¿Que ocurre si cambia el nombre o logotipo de mi estudio? Todos los widgets se actualizan automaticamente – no necesitas regenerar el codigo de insercion.