Cómo incrustar un formulario de registro en tu página de confirmación de pedido de BigCommerce

Objetivos del artículo

Aprende cómo insertar un formulario de registro en tu página de confirmación de BigCommerce para recopilar información adicional de los clientes después de que finalicen el proceso de pago. Estos clientes recientes ya están interesados en tu marca, por lo que la confirmación presenta una gran oportunidad para interactuar más con ellos.

Antes de empezar

Asegúrate de haber realizado la integración con BigCommerce y de haber marcado la opción Añadir automáticamente Klaviyo onsite JavaScript.

Crea el formulario

Puedes crear un formulario de registro e incrustarlo en tu página de confirmación para hacer preguntas relevantes a tus clientes después de finalizar la compra. Por ejemplo, podrías hacer preguntas para saber con qué frecuencia un cliente usa tus productos o qué posibles productos nuevos le podrían interesar comprar.

Para crear el formulario de registro:

1. En Klaviyo, ve a Formularios de registro > Crear formulario de registro > Crear desde cero.
2. En el menú que aparece, asigna un nombre al formulario y selecciona una lista a la que se enviarán los nuevos suscriptores cuando se registren.
3. Selecciona Incrustado como el tipo de formulario.
   

4. Haz clic en Guardar y  diseñar.
5. Esto te llevará al editor de formularios, donde puedes editar los siguientes estilos:
   • Estilos: Edita la apariencia del formulario para que coincida con la marca, como los estilos del formulario o de los campos y el tipo de fuente. También puedes editar cualquier texto haciendo clic en él y reemplazando el idioma predeterminado por el tuyo.
   • Agregar bloques: Aquí puedes agregar contenido a tu formulario para recopilar información, como un cuadro de texto para una pregunta o un campo de fecha para un cumpleaños. Asegúrate de establecer una propiedades del perfil con cada campo que agregues y de no abrumar a los clientes con demasiadas preguntas.
   • Segmentación y comportamiento: elige si quieres que el formulario aparezca en computadoras de escritorio, dispositivos móviles o en ambos. Mantén el formulario configurado como Mostrar a todos los visitantes o No mostrar a los perfiles de Klaviyo existentes.
6. En la barra de menú, selecciona Éxito para editar la página que se muestra después de que alguien envíe el formulario.
7. Cuando estés satisfecho con el diseño del formulario, haz clic en Publicar.
8. En el modal que aparece, copia el código de inserción para tenerlo listo para pegarlo.
   

9. Haz clic en Publicar.

El formulario no aparecerá en el sitio hasta que pegues el código de inserción en el código del sitio.

Verifica la configuración de suscripción de esa lista para que la experiencia del cliente sea fluida. Si la lista es de doble confirmación de suscripción, te convendrá editar las páginas de confirmación. Todas las listas de Klaviyo tienen doble confirmación de suscripción por defecto.

Añade la incrustación a tu sitio de BigCommerce

1. Ve al panel de administración de BigCommerce.
2. Ve a Storefront > Gerente de scripts y haz clic en Crear un script.
3. Nombra el script y configúralo con lo siguiente:
   • Ubicación: encabezado
   • Descripción (opcional): Describe el propósito del script
   • Páginas donde se agregará el script: Confirmación de pedido
   • Tipo de script: Script
     

4. Elimina el contenido del script y, en su lugar, pega el siguiente código para agregar klaviyo.js a la página de confirmación. Ten en cuenta que debes hacer esto incluso si instalaste klaviyo.js previamente en el sitio web:
   

  <script src="https://static.klaviyo.com/onsite/js/PUBLIC_API_KEY/klaviyo.js" async=""></script>
  <script>
     document.addEventListener("DOMContentLoaded", function() {       var elem = document.createElement('div');
     elem.className = 'klaviyo-form-FORM_ID'
     document.body.appendChild(elem);
     });</script>

1. En el fragmento anterior, reemplaza PUBLIC_API_KEY con la clave de API pública del sitio.
2. En el fragmento anterior, reemplaza FORM_ID con el ID del formulario. Para encontrar el ID del formulario, navega al formulario incrustado en tu cuenta de Klaviyo. El ID del formulario es el código de 6 letras al final de la URL.
   

3. Cuando hayas completado todos los detalles del script, haz clic en Guardar.

Ahora, el formulario incrustado se mostrará en la parte inferior de la página después de que alguien realice un pedido. Según el tema, quizá quieras editar el borde, el relleno o el tamaño del formulario en la sección Estilos para asegurarte de que coincida con la apariencia de la página de confirmación de pedido. Publica los cambios que hagas para verlos reflejados.

Siguientes pasos

Después de que empieces a recopilar respuestas con el formulario integrado, cada envío se almacenará en el perfil del cliente como una propiedad personalizada, disponible para usar en segmentos, flujo y plantilla de correo electrónico.

Con base en las respuestas, puedes ramificar la experiencia de posventa. También podrías querer ramificar la serie de bienvenida con base en estos datos o crear segmentos relevantes para enviar campañas. Por ejemplo, digamos que decidimos lanzar un nuevo rímel. Como estamos recopilando datos de interés del producto en este formulario incrustado, podemos notificar sobre el lanzamiento a cualquiera que nos haya dicho que le interesaba el rímel.

Recursos adicionales