Comment intégrer un formulaire d’inscription à votre page de confirmation de commande BigCommerce

Objectif de cet article

Découvrez comment intégrer un formulaire d’inscription sur votre page de confirmation BigCommerce afin de recueillir des informations supplémentaires auprès des clients après qu’ils ont terminé le processus de paiement. Ces clients récents s’intéressent déjà à votre marque, donc la confirmation constitue une excellente occasion de renforcer l’engagement avec eux.

Avant de commencer

Assurez-vous que vous avez intégré BigCommerce et coché l’option Ajouter automatiquement le code JavaScript sur site de Klaviyo.

Créer votre formulaire

Vous pouvez créer un formulaire d’inscription et l’intégrer à votre page de confirmation afin de poser des questions pertinentes à vos clients après leur passage en caisse. Par exemple, vous pourriez poser des questions pour en savoir plus sur la fréquence à laquelle un client utilise vos produits, ou sur les nouveaux produits potentiels qu’il pourrait être intéressé à acheter.

Pour créer votre formulaire d’inscription :

1. Dans Klaviyo, accédez à Formulaires d’inscription > Créer un formulaire d’inscription > Créer de A à Z.
2. Dans le menu qui apparait, nommez votre formulaire et sélectionnez une liste à laquelle les nouveaux abonnés pourront s’inscrire.
3. Comme type de formulaire, sélectionnez Embed.
   

4. Cliquez sur Enregistrer et passer au design.
5. Cela vous amènera dans l’éditeur de formulaire, où vous pourrez modifier les styles suivants :
   • Styles: modifiez l’apparence de votre formulaire pour qu’elle corresponde à votre marque, comme les styles de formulaire ou de champ de saisie, ainsi que le type de police. Vous pouvez également modifier n’importe quel texte en cliquant dessus et en remplaçant le langage par défaut par le vôtre.
   • Add blocks: ici, vous pouvez ajouter du contenu à votre formulaire afin de collecter des informations, comme une zone de texte pour une question ou un champ de date pour un anniversaire. Veillez à définir des propriétés de profil pour chaque champ que vous ajoutez, et à ne pas submerger les clients avec trop de questions.
   • Ciblage et comportement: choisissez si vous souhaitez que le formulaire s’affiche sur ordinateur, sur mobile ou sur les deux. Veillez à ce que votre formulaire soit défini sur Afficher à tous les visiteurs ou Ne pas afficher aux profils Klaviyo existants.
6. Dans la barre de menu, sélectionnez Succès pour modifier la page qui s’affiche après qu’une personne a envoyé votre formulaire.
7. Lorsque vous êtes satisfait du design de votre formulaire, cliquez sur Publier.
8. Dans la fenêtre modale qui s’affiche, copiez votre code d’intégration afin de l’avoir prêt à coller.
   

9. Cliquez sur Publier.

Votre formulaire n’apparaîtra pas sur votre site tant que vous n’aurez pas collé le code intégré dans le code de votre site.

Vérifiez les paramètres de consentement de cette liste afin que l’expérience client soit fluide. Si la liste est à double opt-in, vous devrez modifier les pages de confirmation. Toutes les listes de Klaviyo sont à double opt-in par défaut.

Ajoutez le code intégré à votre site BigCommerce

1. Accédez à la page d’administration de votre compte BigCommerce.
2. Accédez à Storefront > Script Manager et cliquez sur Créer un script.
3. Nommez le script et configurez-le comme suit :
   • Emplacement : en-tête
   • Description (facultatif) : décrivez l’objectif du script
   • Pages auxquelles le script sera ajouté : confirmation de commande
   • Type de script : Script
     

4. Supprimez le contenu du script, puis collez plutôt le code suivant pour ajouter klaviyo.js à votre page de confirmation. Notez que vous devez le faire même si vous avez déjà installé klaviyo.js sur votre site 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. Dans l’extrait ci-dessus, remplacez PUBLIC_API_KEY par la clé d’API publique de votre site.
2. Dans l’extrait ci-dessus, remplacez FORM_ID par l’identifiant de votre formulaire. Pour trouver l’identifiant de votre formulaire, accédez au formulaire intégré dans votre compte Klaviyo. L’identifiant du formulaire est le code à 6 lettres à la fin de l’URL.
   

3. Lorsque vous avez renseigné tous les détails du script, cliquez sur Enregistrer.

Votre formulaire intégré s’affichera désormais au bas de la page après qu’une personne aura passé une commande. Selon votre thème, vous pouvez modifier la bordure, la marge intérieure ou la taille de votre formulaire dans la section Styles afin de vous assurer qu’il correspond à l’apparence de votre page de confirmation de commande ; publiez toutes les modifications que vous effectuez pour les voir s’appliquer.

Prochaines étapes

Après avoir commencé à collecter des réponses avec votre formulaire intégré, chaque soumission sera stockée sur le profil du client en tant que propriété personnalisée, disponible pour une utilisation dans les segments, les flux et les modèles d’e-mail.

En fonction des réponses, vous pouvez créer des embranchements dans l’expérience post-achat. Vous pouvez également créer des embranchements dans votre série de bienvenue en fonction de ces données ou créer des segments pertinents pour envoyer des campagnes. Par exemple, imaginons que nous décidions de lancer un nouveau mascara. Comme nous collectons des données sur l’intérêt pour les produits sur ce formulaire intégré, nous pouvons informer toute personne nous ayant indiqué être intéressée par le mascara lors de la sortie du produit.