Formulario clásico (formulario de reserva paso a paso)
Este artículo explica cómo personalizar el formulario de reserva clásico paso a paso.
Si no estás seguro de qué formulario de reserva usar, consulta Tipos de formulario de reserva / Elige un formulario de reserva.
Cómo personalizar el formulario de reserva clásico
Puedes personalizar el diseño, los colores, las etiquetas, los campos y los textos de cada paso de tu formulario de reserva. Para editar el formulario:
1. Ve a Bookly > Apariencia.
2. Elige Formulario paso a paso.
3. Ajusta la configuración del formulario en las pestañas disponibles.
4. Haz clic en Guardar.
Personalizar colores
Usa el selector de color para ajustar los colores principales del formulario de reserva clásico y que combine con el diseño de tu sitio web.
Después de actualizar los colores, haz clic en Guardar.
Editar textos y añadir detalles de la reserva
Puedes editar el texto que se muestra en cada paso de la reserva.
Haz clic en el texto subrayado para abrir la ventana de edición. Escribe tu texto y añade códigos como {service_name}, {staff_name} o {total_price} para mostrar los detalles de la reserva de forma dinámica.
Empieza a escribir `{` para ver los códigos disponibles. Haz clic en Aplicar y luego en Guardar.
Ejemplo:
Has reservado {service_name} con {staff_name} el {service_date} a las {service_time}. El precio del servicio es {service_price}. Indica tus datos en el siguiente formulario para continuar con la reserva.
Para ver la lista completa de códigos disponibles, consulta Todos los marcadores de posición.
Avanzado: contenido condicional y repetido
Usa bloques condicionales para mostrar texto solo cuando exista determinada información de la reserva.
Ejemplo:
{#if extras} Artículos adicionales: {extras}{/if}
Si utilizas add-ons que permiten varias citas en una misma sesión de reserva, usa bloques repetidos para mostrar los detalles de cada cita.
Ejemplo:
{#each appointments as appointment}
Servicio: {appointment.service_name}
Miembro del personal: {appointment.staff_name}
Fecha y hora: {appointment.appointment_date} a las {appointment.appointment_time}
{/each}
Comprueba la versión móvil
Sección titulada «Comprueba la versión móvil»Si modificas o traduces los títulos de los botones, comprueba también la versión móvil del formulario. Abre Apariencia de Bookly en vista móvil, actualiza los textos de los botones de cada paso y guarda los cambios.
Ocultar pasos o campos
Para ocultar pasos o campos de la reserva, ajusta la configuración del shortcode al añadir el formulario a una página.
Más información: Publicar el formulario de reserva
Consulta las preguntas frecuentes
¿Cómo cambio el color o el tamaño de fuente de un mensaje de advertencia?
¿Cómo oculto los campos de categoría, servicio o empleado en el formulario de reserva?
¿Cómo cambio el color del texto en el formulario de reserva de Bookly?