Reservas en tu web

Con una línea de código, tus clientes reservan desde tu propia web sin salir de ella: el mismo proceso de tu página de Be Schedule (servicio, profesional, día y hora, pago y confirmación) se abre en una ventana sobre tu web.

1. Busca el identificador de tu negocio

Entra en Panel > Página web. La dirección de tu página es squedule.begraffic.com/n/tu-negocio: la última parte (tu-negocio) es el identificador que vas a usar.

2. Pega el script en tu web

Copia esta línea, cambia tu-negocio por tu identificador y pégala justo antes de la etiqueta </body> de tu web:

<script src="https://squedule.begraffic.com/embed.js"
        data-negocio="tu-negocio" async></script>

Al recargar tu web verás el botón «Reservar cita» abajo a la derecha. Al pulsarlo se abre la ventana de reserva; al terminar o cerrarla, tu cliente sigue en tu web.

Funciona en cualquier web que permita añadir código HTML. Los menús cambian según la versión y el plan de cada plataforma; estos son los habituales:

Sin código: enlace directo

Si tu plataforma no permite scripts (o para redes sociales, Google Business o Linktree), usa el enlace de tu página: https://squedule.begraffic.com/n/tu-negocio. Abre tu página de Be Schedule con el botón de reservar.

Ajusta el botón flotante con atributos en la misma etiqueta <script>:

Por ejemplo, un botón de otro color, a la izquierda, que dice «Pide tu cita»:

<script src="https://squedule.begraffic.com/embed.js"
        data-negocio="tu-negocio"
        data-color="#46143E"
        data-texto="Pide tu cita"
        data-posicion="left" async></script>

Cualquier botón o enlace de tu web abre la reserva si le añades data-be-open. Funciona también con elementos que tu web añade más tarde.

<button data-be-open>Reservar ahora</button>

<a href="#" data-be-open>Pide tu cita</a>

Con un servicio ya elegido

Añade data-servicio con el nombre del servicio tal como aparece en Panel > Servicios (no distingue mayúsculas). La reserva empieza con ese servicio elegido y se salta ese paso.

<button data-be-open data-servicio="Corte y peinado">Reservar corte</button>

Varios negocios en la misma web

Con data-negocio en el botón se abre la reserva de otro negocio (por ejemplo, cada sede de una cadena):

<button data-be-open data-negocio="mi-salon-centro">Sede Centro</button>
<button data-be-open data-negocio="mi-salon-norte">Sede Norte</button>

El script expone window.BeSchedule para abrir y cerrar la reserva desde tu código:

document.querySelector("#reservar").addEventListener("click", () => {
  window.BeSchedule.open({ servicio: "Manicura" });
});

React y Next.js

Carga el script una sola vez (en el layout) y llama a BeSchedule.open desde tus componentes:

// app/layout.tsx
import Script from "next/script";

<Script src="https://squedule.begraffic.com/embed.js" data-negocio="tu-negocio" strategy="afterInteractive" />

// En cualquier componente
<button onClick={() => window.BeSchedule?.open()}>Reservar</button>

Tu web recibe eventos en document para reaccionar a lo que pasa en la reserva:

booking trae los datos de la reserva confirmada:

document.addEventListener("be:booked", (event) => {
  const { negocio, booking } = event.detail;
  console.log("Reserva confirmada en", negocio, booking.service, booking.start);
});

Usa be:booked para registrar cada reserva como conversión en tus herramientas de medición.

Google Tag Manager y Google Analytics 4

document.addEventListener("be:booked", (event) => {
  const { booking } = event.detail;
  window.dataLayer = window.dataLayer || [];
  window.dataLayer.push({
    event: "reserva_confirmada",
    servicio: booking.service,
    valor: booking.total,
  });
});

En GTM, crea un activador de evento personalizado con el nombre reserva_confirmada y úsalo en tu etiqueta de GA4 o de conversión de Google Ads.

Píxel de Meta

document.addEventListener("be:booked", (event) => {
  window.fbq && window.fbq("track", "Schedule", { value: event.detail.booking.total });
});

• La reserva se abre en una ventana segura de squedule.begraffic.com dentro de tu web: tu web no puede leer lo que escribe el cliente, y los datos de pago nunca pasan por ella.
• Los avisos de la reserva (be:booked) solo se envían a la web que abrió la ventana.
• La ventana no muestra su propio aviso de cookies y no usa cookies de analítica ni de publicidad: solo lo necesario para que el cliente inicie sesión y complete su reserva.
• Tu aviso de privacidad debe mencionar que las reservas las gestiona Be Schedule.

Si tu web usa Content-Security-Policy

Permite el dominio de Be Schedule para el script y para la ventana:

script-src https://squedule.begraffic.com;
frame-src https://squedule.begraffic.com;

¿Sigues con dudas? Escríbenos desde Panel > Configuración y te ayudamos con la instalación.