SchedulingKit
Webflow Widget de reservas

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 Disenador de Webflow. Control total sobre la ubicacion, tamano 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.

500K+
Webflow sites published
2 min
Embed setup in the Designer
37%
Higher engagement with on-page booking
Guía de instalación

Cómo agregar un widget de reservas a Webflow

Sigue estos pasos para integrar el widget de reservas de SchedulingKit en tu sitio Webflow

1

Copy Embed Snippet

Grab the HTML embed code from your SchedulingKit dashboard under the Embed section.

2

Open Webflow Designer

Open your project in the Webflow Designer. Navigate to the page where you want to add the booking widget.

3

Add an Embed Element

From the Add Elements panel (A key), drag the Embed element (under Components) into your desired position on the canvas.

4

Paste and Configure

Double-click the Embed element, paste the SchedulingKit snippet, and click Save & Close. The widget preview appears on the canvas.

5

Publish to Staging or Production

Click Publish and choose your staging or custom domain. The widget goes live with your Webflow site and respects all Webflow interactions and animations.

Código de integración

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.

Funciones del widget

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

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 frecuentes

Preguntas sobre el widget de reservas de Webflow

El widget se previsualiza en el Disenador de Webflow?

La insercion muestra un marcador de posicion en el lienzo del Disenador. Para ver el widget en vivo, usa el modo de Vista Previa de Webflow o publica en tu dominio de staging.

Puedo usar el widget en paginas de coleccion CMS de Webflow?

Si. Agrega un campo de texto plano del CMS para la URL de la pagina de reservas, luego referencialo dentro del elemento de Insercion usando la funcion de insercion dinamica de Webflow. Cada elemento de coleccion renderizara su propio widget de reservas.

El widget funcionara en el plan gratuito de Webflow?

El elemento de Insercion esta disponible en todos los planes de Webflow, incluyendo el plan Starter gratuito. Sin embargo, la publicacion con dominio personalizado y la Inyeccion de Codigo en todo el sitio requieren un plan de sitio pagado.

Afecta al rendimiento del sitio Webflow?

No. El script del widget se carga de forma asincrona despues del contenido de tu pagina y pesa menos de 30 KB. No tiene impacto en la puntuacion Lighthouse de tu sitio 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