Cómo rellenar previamente información del invitado en una inserción

Si tu sitio ya recopila información como el nombre o el email, puedes pasar esos datos a tu inserción de Calendly. Esto ahorra tiempo a los usuarios y crea una experiencia de reserva más fluida al completar el formulario automáticamente.

Esta guía muestra cómo utilizar la inserción avanzada de Calendly para completar previamente los detalles del invitado.

Detalles que puedes completar previamente

Calendly permite rellenar previamente estos campos:

• Nombre completo o nombre y apellido (si se recopilan por separado)
• Email
• Respuestas a un máximo de 10 preguntas de los invitados
• Campos personalizados (etiquetados a1–a10) utilizados en las preguntas de tu evento

Añade datos prellenados a una inserción avanzada

Para prellenar la información del invitado, usa la inserción avanzada de JavaScript (Calendly.initInlineWidget) e incluye el campo de prellenado.

Ejemplo:

<div id="calendly-embed-element"</div
<script src="https://assets.calendly.com/assets/external/widget.js"</script
<script
  Calendly.initInlineWidget({
    url: 'https://calendly.com/YOUR_USERNAME',
    parentElement: document.getElementById('calendly-embed-element'),
    prellenar: {
      nombre: 'John Doe',
      correo electrónico: 'john@example.com',
      respuestasPersonalizadas: {
        a1: 'Sí',
        A2: 'En la oficina'
      }
    }
  });
</script

Reemplaza YOUR_USERNAME por tu enlace real de Calendly. Actualiza los campos con la información de tu invitado.

Rellena previamente un formulario o URL personalizada

Si tu sitio recopila datos de un formulario o URL, utiliza JavaScript para obtener esos datos e insertarlos en la inserción.

Ejemplo: obtén valores de la URL.

<script
function getUrlVars() {
  const vars = {};
  window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,k,v) {
    vars[k] = decodeURIComponent(v);
  });
  return vars;
}

const nameValue = getUrlVars()["name"];
const emailValue = getUrlVars()["email"];

Calendly.initInlineWidget({
  url: 'https://calendly.com/YOUR_USERNAME',
  parentElement: document.getElementById('calendly-embed-element'),
  prefill: {
    nombre: nameValue,
    correo electrónico: emailValue
  }
});
</script

Incluye también este guion:

<script src="https://assets.calendly.com/assets/external/widget.js"</script

Usa nombre y apellido por separado

Si tu evento recopila el nombre y el apellido como campos separados, usa:

prefill: {
  firstName: "Jane",
  lastName: "Smith",
  email: "jane@example.com"
}

Prellene respuestas a preguntas personalizadas

Si tu evento incluye preguntas de los invitados, se etiquetarán como a1 a a10. Utiliza el objeto respuestasPersonalizadas para pasar respuestas.

Ejemplo:

customAnswers: {
  a1: "Sí",
  a2: "Zoom",
  a3: "Sin restricciones dietéticas"
}

El orden de tus preguntas en Calendly determina qué campo se corresponde con cada etiqueta.