Inserta un Widget de Reservas en tu Sitio Webflow
Agrega el widget de reservas de SchedulingKit a Webflow usando el elemento de Insercion de Codigo Personalizado en el Diseñador de Webflow. Control total sobre la ubicación, tamaño y estilo - sin plugins externos necesarios.
Plan gratuito para siempre • Sin tarjeta de crédito
Un widget de reservas para Webflow es un calendario integrable que permite a los visitantes programar citas directamente en tu sitio web de Webflow sin salir de la página. SchedulingKit te permite insertar un widget de reservas gratuito en Webflow en 2026. Ver todo Widget de reservas.
Cómo agregar un widget de reservas a Webflow
Sigue estos pasos para integrar el widget de reservas de SchedulingKit en tu sitio Webflow
Copiar el fragmento de inserción
Obtenga el código HTML de inserción desde su panel de control de SchedulingKit en la sección de Inserción.
Abrir el diseñador de Webflow
Abra su proyecto en el diseñador de Webflow. Navegue a la página donde desea añadir el widget de reservas.
Añadir un elemento de inserción
Desde el panel de Añadir elementos (tecla A), arrastre el elemento de Inserción (bajo Componentes) a la posición deseada en el lienzo.
Pegar y configurar
Haga doble clic en el elemento de Inserción, pegue el fragmento de SchedulingKit y haga clic en Guardar y cerrar. La vista previa del widget aparece en el lienzo.
Publicar en Staging o Producción
Haga clic en Publicar y elija su dominio de staging o personalizado. El widget se activa en su sitio de Webflow y respeta todas las interacciones y animaciones de Webflow.
Código de integración listo para Webflow
Copia y pega este fragmento en tu sitio Webflow para agregar un widget de reservas al instante:
<!-- SchedulingKit Booking Widget --> <div id="schedulingkit-widget"></div> <script src="https://widget.schedulingkit.com/embed.js" data-url="https://app.schedulingkit.com/YOUR-BUSINESS" data-style="inline" data-primary-color="#4F46E5" async> </script>
Reemplaza YOUR-BUSINESS con la URL de tu página de reservas de SchedulingKit. Crea tu cuenta gratuita para obtener tu código de integración personalizado.
Webflow Funciones del widget
Funciones específicas de la plataforma que hacen que el widget de reservas funcione perfectamente en Webflow
Designer-Native Embed
The Embed element sits on the Webflow canvas like any other element, position it using flexbox, grid, or absolute positioning.
CMS Integration
Use Webflow CMS to create dynamic booking pages where each collection item embeds a different booking widget based on a CMS field.
Interactions Support
Trigger Webflow interactions and animations when the widget loads or when a booking is confirmed, creating a polished user experience.
Responsive Breakpoints
Style the embed container differently at each Webflow breakpoint, desktop, tablet, mobile landscape, and mobile portrait.
Mejores prácticas para widgets de reserva en Webflow
Consejos para aprovechar al máximo tu widget de reservas integrado en Webflow
Wrap the Embed element in a div with a set min-height to prevent Cumulative Layout Shift during loading
Use Webflow's CMS to dynamically insert different booking page URLs per collection item
Place the widget in a section with an ID anchor so CTAs elsewhere on the page can scroll to it
For a site-wide floating button, add the pop-up widget script in Project Settings → Custom Code → Footer Code
Test on all four Webflow breakpoints to ensure the widget resizes gracefully
Preguntas sobre el widget de reservas de Webflow
Añade un widget de reserva a Webflow hoy
Únete a miles de empresas que integran widgets de reserva en Webflow con SchedulingKit
Plan gratuito para siempre • Sin tarjeta de crédito