Guía rápida de instalación

Pon el widget de Restoo en marcha en unos minutos, sin saber programar.

Solo necesitas tu Account ID, el identificador corto de tu local en Restoo. En los ejemplos de abajo usamos best-burger como valor de muestra.

Tu Account ID es el subdominio que Restoo te asigna en myrestoo.net. Si gestionas tus reservas en https://best-burger.myrestoo.net/myrestoo, tu Account ID es best-burger.

Si no sabes cuál elegir, la introducción compara las tres y explica por qué recomendamos el modal.

Modal sobre tu página (recomendado)

1. Añade Restoo.js en tu web

   Pega Restoo.js justo antes de la etiqueta de cierre </body>, y sustituye best-burger por tu Account ID.

   Si tu web ya carga etiquetas de medición (GA4, Google Ads, Meta, TikTok, ChatGPT Ads…), pégalo después de ellas: así no pierdes ningún evento de reserva.

   <script type="module" src="https://best-burger.myrestoo.net/js/restoo-widget"></script>
   
2. Marca cualquier botón o enlace de tu web

   Añade el atributo data-restoo-open a cualquier botón o enlace que deba abrir el formulario de reservas.

   <button data-restoo-open>Reservar</button>
   
3. Conecta el botón con el widget

   Añade este bloque justo debajo de Restoo.js. Se carga de forma diferida, así que la configuración va dentro de un restoo:loaded: es lo que garantiza que window.Restoo ya exista.

   <script>
     window.addEventListener("restoo:loaded", () => {
       window.Restoo("best-burger").bindTriggers();
     });
   </script>
   
4. Listo

   Recarga la página y haz clic en tu botón: el formulario de reservas se abre encima de tu página. Puedes poner el mismo atributo data-restoo-open en tantos botones o enlaces como quieras.

Integrado en tu página

1. Añade Restoo.js en tu web

   Pega Restoo.js justo antes de la etiqueta de cierre </body>, y sustituye best-burger por tu Account ID.

   Si tu web ya carga etiquetas de medición (GA4, Google Ads, Meta, TikTok, ChatGPT Ads…), pégalo después de ellas: así no pierdes ningún evento de reserva.

   <script type="module" src="https://best-burger.myrestoo.net/js/restoo-widget"></script>
   
2. Añade un contenedor donde incrustar el formulario

   Añade un <div> vacío con un id único en donde deba aparecer el formulario de reservas dentro de tu página.

   <div id="restoo-widget"></div>
   
3. Monta el widget en tu contenedor

   Añade este bloque justo debajo de Restoo.js, con el id del <div> que acabas de crear. Se carga de forma diferida, así que la configuración va dentro de un restoo:loaded: es lo que garantiza que window.Restoo ya exista.

   <script>
     window.addEventListener("restoo:loaded", () => {
       window.Restoo("best-burger").mount("restoo-widget");
     });
   </script>
   
4. Listo

   Recarga la página: el widget de reservas ya aparece dentro de tu contenedor.

Alojado en Restoo

1. Localiza la dirección de tu página alojada en Restoo

   Es la dirección desde la que gestionas tus reservas, sin el /myrestoo final: si entras por https://best-burger.myrestoo.net/myrestoo, la dirección de tu página alojada es https://best-burger.myrestoo.net.

2. Enlázala desde tu web

   Pon esa dirección en el botón de «Reservar» de tu web. Vale cualquier botón o enlace que ya tengas.

   <a href="https://best-burger.myrestoo.net">Reservar</a>
   
3. Listo

   Todas las opciones de configuración están en tu cuenta de Restoo, sin tocar código.

Ese mismo enlace puedes usarlo donde quieras: tu perfil de Google, la biografía de tus redes o tu newsletter.

Con esto ya se puede reservar. Los siguientes pasos son opcionales, aunque muy recomendables: hacer que el widget parezca tuyo y que cada reserva llegue a tu analítica.

​

Siguientes pasos

Apariencia

Ajusta el widget a tu marca: colores y tipografías.

Configurar tus integraciones

Activa GA4, Google Ads, Meta, TikTok, ChatGPT Ads o GTM en tu cuenta y empieza a medir.