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

Objetivos de aprendizaje

Aprende a incrustar un formulario de registro en tu página de confirmación BigCommerce para recopilar información adicional del cliente después de que termine el proceso de la página de pago. Estos clientes recientes ya están interesados en tu marca, por lo que la confirmación representa una gran oportunidad para interactuar más con ellos.

Antes de empezar

Asegúrate de que te has integrado con BigCommerce y de que has marcado la opción Añadir automáticamente JavaScript in situ de Klaviyo.

Construye tu formulario

Puedes crear un formulario de registro e incrustarlo en tu página de confirmación para hacer preguntas relevantes a tu cliente después de que pague. Por ejemplo, podrías hacer preguntas para saber más sobre la frecuencia con la que un cliente utiliza tus productos, o qué posibles productos nuevos podría estar interesado en comprar.

Para construir tu formulario de registro:

1. En Klaviyo, navega hasta formulario de registro > Crea el formulario de registro > Constrúyelo desde cero.
2. En el menú que aparece, dale un nombre a tu formulario y selecciona una lista para que el nuevo suscriptor lo envíe. 
3. Selecciona Incrustar como tipo de formulario.
   
4. Haz clic en Guardar y diseñar. 
5. Esto te llevará al editor de formularios donde podrás editar los siguientes estilos:
   • Estilos: Edita la apariencia de tu formulario para que coincida con tu marca, como los estilos de formulario o campo y el tipo de fuente. También puedes editar cualquier texto haciendo clic sobre él y sustituyendo la lengua por defecto por la tuya. 
   • Añadir bloque: Aquí puedes añadir contenido a tu formulario para recoger información, como un cuadro de texto para una pregunta o un campo de fecha para un cumpleaños. Asegúrate de establecer unas propiedades del perfil con cada campo que añadas, y de no abrumar al cliente con demasiadas preguntas.
   • Orientación y comportamiento: Elige si quieres que el formulario aparezca en escritorio, móvil o ambos. Mantén tu formulario configurado como Mostrar a todos los visitantes o No mostrar al perfil existente de Klaviyo.  
6. En la barra de menús, selecciona Éxito para editar la página que se muestra después de que alguien envíe tu formulario.
7. Cuando estés satisfecho con el diseño de tu formulario, haz clic en Publicar.
8. Desde el modal que aparece, copia tu código de incrustación para tenerlo listo para pegar. 
   
9. Haz clic en Publicar.

Tu formulario no aparecerá en tu sitio hasta que hayas pegado el código de incrustación en el código de tu sitio.

Verifica los ajustes de inclusión de esa lista para que la experiencia del cliente sea perfecta. Si la lista es de doble confirmación de suscripción, deberás editar las páginas de confirmación. Todas las listas de Klaviyo están configuradas por defecto con doble confirmación de suscripción.

Añade la incrustación a tu sitio BigCommerce

1. Accede a la administración de BigCommerce.
2. Ve a Storefront > Script Gerente y haz clic en Crear un Script .
3. Ponle un nombre al script y configúralo con lo siguiente:
   • Localización: Cabeza
   • Descripción (opcional): Describe la finalidad del guión
   • Páginas donde se añadirá el script: Confirmación de pedido
   • Tipo de guión: Guión
     
4. Elimina el contenido del script y en su lugar pega el siguiente código para añadir Klaviyo.js a tu página de confirmación. Ten en cuenta que tienes que hacer esto aunque ya hayas instalado Klaviyo.js en tu 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>

5. En el fragmento anterior, sustituye PUBLIC_API_KEY por la clave pública de API de tu sitio.
6. En el fragmento anterior, sustituye FORM_ID por el ID de tu formulario. Para encontrar el ID de tu formulario, navega hasta el formulario incrustado en tu cuenta de Klaviyo. El ID del formulario es el código de 6 letras que aparece al final de la URL.
   
7. Cuando hayas rellenado todos los datos del guión, haz clic en Guardar.

Tu formulario incrustado se mostrará ahora en la parte inferior de la página después de que alguien realice un pedido. Dependiendo de tu tema, puede que quieras editar el borde, el relleno o el tamaño de tu formulario en la secciónEstilos para asegurarte de que coincide con el aspecto de tu página de confirmación de pedido; publica cualquier cambio que hagas para verlo reflejado.

Siguientes pasos

Cuando empieces a recopilar respuestas con tu formulario incrustado, cada envío se tienda, comercio en el perfil del cliente como una propiedad personalizada, disponible para su uso en segmento, flujo y plantillas de correo electrónico.

Según las respuestas, puedes ramificar la experiencia posventa. También puedes ramificar tu serie de bienvenida basándote en estos datos o crear un segmento relevante al que enviar campañas. Por ejemplo, supongamos que decidimos lanzar una nueva máscara de pestañas. Como estamos recopilando datos sobre el interés por el producto en este formulario incrustado, podemos notificar el lanzamiento del producto a cualquier persona que nos haya dicho que estaba interesada en la máscara de pestañas.

Recursos adicionales

• Primeros pasos con los formularios de registro
• Cómo incrustar un formulario de registro en tu sitio web