Integración web
Con la integración web, muestras contenido de Bookicorn directamente en tu propia página web. Tus clientes pueden ver el horario de clases, explorar paquetes y conocer a tu equipo. Para reservas y compras, son redirigidos de forma fluida a la plataforma Bookicorn.
¿Qué son los widgets?
Los widgets son bloques interactivos que puedes combinar libremente. Cada widget muestra una parte específica de tu estudio:
| Widget | Qué muestra |
|---|---|
| Horario de clases | Horario semanal interactivo con filtros y detalles de clases |
| Paquetes de créditos | Todos los paquetes con precios, créditos y enlace "Comprar" |
| Resumen de entrenadores | Tu equipo con perfiles y próximas clases |
| Próximas clases | Lista compacta de las próximas citas |
| Reserva rápida | Una sola clase destacada con enlace "Reservar" |
| Categorías | Categorías de clases para explorar |
| Entrenador destacado | Un solo entrenador en primer plano |
| Reseñas | Reseñas de clientes |
| Botón de inicio de sesión | Inicio de sesión de miembros |
| Estado de créditos | Visualización del saldo de créditos para miembros conectados |
| Mis reservas | Próximas reservas de un miembro |
| Mapa de ubicación | Mapa con la ubicación de tu estudio |
Además, hay widgets de diseño (encabezados, bloques de texto, espaciadores, separadores) que te ayudan a estructurar el diseño.
Cómo funciona
Paso 1: Crear una integración
- En el área de administración, ve a Marketing → Integraciones
- Haz clic en "Nueva integración"
- Introduce un nombre (p. ej. "Página de inicio", "Página de clases")
- Elige una plantilla como punto de partida (Horario de clases, Completa, Solo paquetes, Enfoque en entrenadores, Vista rápida o Vacía)
- Haz clic en "Crear" - se abre el Widget Builder
Paso 2: Montar tus widgets
En el Widget Builder, usas arrastrar y soltar para componer lo que debe aparecer en tu página web. Puedes organizar widgets en filas con varias columnas y personalizar los colores para que coincidan con tu diseño.
Paso 3: Insertar el código de incrustación
Obtienes un breve código HTML que insertas en tu página web:
<script src="https://app.bookicorn.net/widget/loader.js" async defer></script>
<bookicorn-widget studio="your-studio" integration="your-integration"></bookicorn-widget>
<a href="https://www.bookicorn.net" target="_blank" rel="noopener" class="bookicorn-backlink" style="display:block;text-align:center;font-size:11px;color:#9ca3af;margin-top:8px;text-decoration:none;font-family:system-ui,-apple-system,sans-serif;">Powered by Bookicorn</a>
Paso 4: Listo
El widget aparece inmediatamente en tu página web. Todos los datos vienen en vivo desde Bookicorn - clases, entrenadores, paquetes, disponibilidad. Los cambios en Bookicorn son automáticamente visibles en tu página web.
Ventajas
| Descripción | |
|---|---|
| Se adapta a tu sitio | Los colores, fuente y estilo se adaptan a tu página web |
| Siempre actualizado | Los datos vienen en vivo de Bookicorn - sin mantenimiento manual |
| Responsivo | Funciona perfectamente en escritorio, tablet y móvil |
| Aislado | Los estilos del widget no afectan a tu página web y viceversa |
| Rápido | Se carga de forma asíncrona y no bloquea tu página |
| Seguro | Los datos se transmiten cifrados por HTTPS |
Requisitos
Complemento necesario
La integración web es un complemento de pago (29 €/mes).
Para activar:
- Ve a Configuración → Tienda de complementos
- Selecciona "Website Integration"
- Haz clic en "Activar"
Requisitos técnicos
Tu página web solo necesita permitir JavaScript. Este es el caso de todas las páginas web y constructores modernos (WordPress, Wix, Squarespace, Webflow, Jimdo, etc.).
Varias integraciones
Puedes crear tantas integraciones como quieras - para diferentes páginas o propósitos:
| Integración | Página | Widgets de ejemplo |
|---|---|---|
| Página de inicio | Página principal | Próximas clases, paquetes, reseñas |
| Horario de clases | /clases | Horario completo con filtros |
| Equipo | /equipo | Resumen de entrenadores |
| Precios | /precios | Paquetes de créditos |
Cada integración tiene su propio código de incrustación y se puede personalizar por separado.
Terminología dinámica
Los widgets usan automáticamente las etiquetas que has configurado en tu estudio. Si prefieres "Coach" en lugar de "Trainer" y "Talleres" en lugar de "Cursos" - el widget mostrará esos términos.
Puedes encontrar este ajuste en Configuración → General → Terminología.