Comment configurer un formulaire de retour en stock

Découvrez comment configurer et personnaliser un formulaire d’inscription au retour en stock pour votre boutique en ligne. À l’aide de l’éditeur de formulaires de Klaviyo, vous pouvez personnaliser à la fois le bouton « Prévenez-moi » qui s’affiche lorsqu’un produit de votre site est en rupture de stock, et le formulaire que vos clients utilisent pour s’inscrire aux notifications de retour en stock par e-mail, messagerie texte et WhatsApp.

Avant de commencer

Les formulaires de retour en stock ne sont disponibles que pour les boutiques disposant d’une intégration Shopify ou BigCommerce activée dans Klaviyo. Si vous utilisez une autre plateforme, consultez plutôt notre guide d’installation du flux de retour en stock.

Avant de publier votre formulaire, assurez-vous que Klaviyo onsite tracking (Klaviyo.js) est installé sur votre vitrine afin que Klaviyo puisse afficher le bouton et le formulaire.

Dans cet article, vous apprendrez comment :

• Supprimez tout code Klaviyo de retour en stock existant de votre boutique Shopify ou BigCommerce (le cas échéant).
• Activez et personnalisez votre bouton de retour en stock et votre formulaire d’inscription

Fonctionnement du formulaire de retour en stock sur votre vitrine

Après avoir publié un formulaire de retour en stock, Klaviyo affiche automatiquement un bouton personnalisable « Prévenez-moi » sur les pages produit lorsque la variante sélectionnée est en rupture de stock et que le produit correspond à vos paramètres de ciblage. Vous pouvez personnaliser ce bouton dans l’éditeur de formulaires, à côté du formulaire lui-même. Le bouton apparaît et disparaît automatiquement en fonction de votre inventaire de produits.

Lorsqu’un acheteur clique sur le bouton « Me prévenir », votre formulaire s’affiche et lui permet de choisir comment il souhaite être averti lorsque le produit est à nouveau disponible, selon la façon dont vous avez configuré votre formulaire :

• E-mail : si vous incluez un champ e-mail, les acheteurs peuvent saisir leur adresse e-mail pour recevoir une alerte de réapprovisionnement par e-mail. Vous pouvez également ajouter une case à cocher facultative permettant aux acheteurs de s’inscrire pour recevoir des e-mails marketing promotionnels.
• Messagerie texte et WhatsApp : Si vous incluez un champ de numéro de téléphone, les acheteurs peuvent s’inscrire aux alertes de réapprovisionnement par message texte, WhatsApp, ou les deux, selon les canaux que vous sélectionnez pour ce champ. Les acheteurs doivent donner leur consentement explicite pour recevoir des messages promotionnels via les canaux sélectionnés. Ce consentement est requis, et ne peut pas être rendu facultatif, et le texte de divulgation doit être présent.

Après qu’un acheteur a envoyé le formulaire, Klaviyo enregistre un événement s’abonner à retour en stock sur son profil. Pour envoyer des alertes de retour en stock, configurez un flux de retour en stock déclenché par cet indicateur, avec un délai de retour en stock avant vos messages de notification. Les acheteurs restent dans ce délai jusqu’à ce que le produit respecte vos paramètres d’inventaire et de notification de retour en stock. Définissez les messages de notification sur En ligne afin de les envoyer automatiquement.

Notez que l’A/B testing et les méthodes d’opt-in non traditionnelles pour les SMS et WhatsApp (par exemple, Smart Opt-in et tap-to-text) ne sont pas pris en charge pour les formulaires de retour en stock.

Supprimer l’extrait de code de retour en stock existant

Si vous aviez déjà installé l’extrait de code de Klaviyo pour le retour en stock, vous devez d’abord le supprimer afin d’éviter les doublons de boutons ou de formulaires.

Développez la section correspondant à la plateforme de votre boutique pour voir comment supprimer le code. Si vous ne savez pas quel script ou quel code supprimer, contactez votre développeur ou reportez-vous à vos notes d’installation d’origine.

<script src="https://a.klaviyo.com/media/js/onsite/onsite.js"></script>
<script>
    var klaviyo = klaviyo || [];
    klaviyo.init({
      account: "PUBLIC_API_KEY",
      platform: "shopify"
    });
    klaviyo.enable("backinstock",{ 
    trigger: {
      product_page_text: "Notify Me When Available",
      product_page_class: "button",
      product_page_text_align: "center",
      product_page_margin: "0px",
      replace_anchor: false
    },
    modal: {
     headline: "{product_name}",
     body_content: "Register to receive a notification when this item comes back in stock.",
     email_field_label: "Email",
     button_label: "Notify me when available",
     subscription_success_label: "You're in! We'll let you know when it's back.",
     footer_content: '',
     additional_styles: "@import url('https://fonts.googleapis.com/css?family=Helvetica+Neue');",
     drop_background_color: "#000",
     background_color: "#fff",
     text_color: "#222",
     button_text_color: "#fff",
     button_background_color: "#439fdb",
     close_button_color: "#ccc",
     error_background_color: "#fcd6d7",
     error_text_color: "#C72E2F",
     success_background_color: "#d3efcd",
     success_text_color: "#1B9500"
    }
  });
</script>

Créer un formulaire de retour en stock

1. Dans le panneau de navigation principal de Klaviyo, sélectionnez l’onglet Formulaires d’inscription.
2. Cliquez sur Créer un formulaire.
3. Dans la barre de recherche, saisissez « retour en stock » et sélectionnez un modèle Retour en stock prédéfini à personnaliser.
   

• Pour partir d’un formulaire vierge plutôt que d’un modèle, cliquez sur Créer un formulaire vierge. Si le sélecteur Canal apparaît, sélectionnez Web. Choisissez Retour en stock (pop-up uniquement) comme type de formulaire.

4. Saisissez un nom pour votre formulaire, puis choisissez les listes pour les inscriptions promotionnelles collectées via ses champs d’e-mail et de numéro de téléphone. Pour un formulaire vierge, sélectionnez E-mail, message texte, ou les deux, puis choisissez une liste pour chaque option sélectionnée. Vous configurerez WhatsApp sur le champ du numéro de téléphone dans l’éditeur.
5. Cliquez sur Créer un formulaire si vous avez sélectionné un modèle, ou sur Enregistrer et concevoir si vous êtes parti d’un formulaire vierge, pour ouvrir l’éditeur.

6. Sélectionnez l’étape Bouton d’affichage du produit dans la barre de menus. Notez que cela doit toujours être la première étape du formulaire et ne peut pas être supprimé.
7. Dans le menu d’édition à gauche, choisissez l’emplacement où le bouton doit apparaître sur vos pages produits :
   • Remplacer le bouton Ajouter au panier: le bouton « Me prévenir » remplacera le bouton « Ajouter au panier » pour les articles en rupture de stock.
   • Empilé: le bouton « Me prévenir » apparaîtra sous le bouton « Ajouter au panier » (lorsqu’il est affiché comme « Épuisé »).
     

1. Utilisez les options Texte, Style de bouton, Bordureet Ombre portée pour mettre à jour le libellé et le style du bouton « Me prévenir ».
2. Sélectionnez la première étape d’adhésion, par exemple Adhésion par e-mail, puis ouvrez Styles pour ajuster les couleurs, les polices, et la mise en page afin que votre formulaire corresponde à votre marque.

3. Passez en revue chaque étape d’adhésion restante et l’étape Succès en la sélectionnant dans la barre de menus. Cliquez sur des blocs de texte ou de saisie individuels pour modifier leur contenu et leurs paramètres selon vos besoins.

1. Si votre formulaire inclut un champ de numéro de téléphone, sélectionnez-le et définissez canal sur message texte, WhatsApp ou WhatsApp et message texte. Terminez la configuration des canaux sélectionnés avant de publier, et passez en revue le texte de divulgation pour ces canaux.
2. Shopify uniquement (facultatif) : pour contrôler où apparaît le bouton "Me prévenir", accédez à Ciblage et comportement > Ciblage, puis utilisez les tags Shopify pour inclure ou exclure des produits spécifiques pour lesquels le bouton doit apparaître.
   

3. Lorsque vous êtes satisfait de votre formulaire, cliquez sur Publier ou planifier, puis cliquez sur Publier maintenant pour le mettre en ligne. Une fois votre formulaire en ligne, le bouton d’affichage de votre produit s’affichera pour les variantes en rupture de stock qui correspondent à vos paramètres de ciblage.
4. Après la publication, confirmez que vous disposez d’un flux de retour en stock pour envoyer des notifications. Si vous ne l’avez pas déjà rejetée, une invite s’affiche pour vous aider à en configurer une.

• Si vous avez déjà un flux de retour en stock déclenché par s’abonner au retour en stock, vous n’avez pas besoin d’en créer un autre. Confirmez qu’il inclut un délai retour en stock et que ses messages de notification sont En ligne afin d’être envoyés automatiquement. Si l’invite s’affiche, cliquez sur Ignorer.
• Si vous n’avez pas de flux de retour en stock, cliquez sur Quitter et créer un flux lorsque l’invite s’affiche, puis suivez Comment créer un flux de retour en stock. Si l’invite n’apparaît pas, suivez le même guide pour créer le flux.

Analytics pour les formulaires de retour en stock

Après avoir publié votre formulaire, accédez à formulaire d’inscription, ouvrez le menu à 3 points à côté de votre formulaire de retour en stock, puis sélectionnez Analyses.

Vous pouvez surveiller les indicateurs de votre formulaire de retour en stock sur sa page d’analyse, y compris les envois de formulaires de retour en stock et les inscriptions marketing. Le taux d’envoi correspond au nombre d’envois de formulaires de retour en stock divisé par le nombre de vues du formulaire. Le consentement marketing est mesuré séparément.

Cette page inclut également des graphiques des données du formulaire par étape et par type de collecte de données :

• engagement: cela fait référence aux abonnements aux retours en stock (par exemple, lorsqu’un acheteur s’inscrit pour recevoir des alertes de réapprovisionnement par e-mail).
• Abonnements marketing : cela désigne le moment où les acheteurs donnent leur consentement pour recevoir des messages promotionnels, soit en cochant la case d’abonnement aux e-mails marketing, soit en envoyant un numéro de téléphone avec le consentement promotionnel requis pour la messagerie texte, WhatsApp, ou les deux.

Résolution des problèmes de retour en stock

Si votre expérience de retour en stock ne fonctionne pas comme prévu, consultez les problèmes courants suivants.

Le bouton « M’avertir » n’apparaît pas ou n’est pas au bon endroit

Si le bouton "Me notifier" est manquant sur votre page produit ou si vous souhaitez le configurer pour qu’il apparaisse à un autre emplacement personnalisé, vous pouvez contrôler manuellement son emplacement à l’aide de la classe CSS klaviyo-bis-trigger.

<a class="klaviyo-bis-trigger" href="#">Notify Me When Available</a>

Ajoutez l’élément d’exemple à l’emplacement où vous souhaitez le bouton « M’avertir », ou ajoutez la classe klaviyo-bis-trigger à un élément existant à cet endroit. Avec Remplacer le bouton Ajouter au panier, Klaviyo masque cet élément et affiche le bouton à sa place. Avec Empilé, Klaviyo affiche le bouton après cet élément. Cela peut aider avec un thème personnalisé ou non standard, mais cela ne résoudra pas toujours un problème de bouton manquant. Si vous avez des difficultés à configurer un emplacement de bouton personnalisé, consultez votre développeur.

Compatibilité avec le paramètre Shopify « Continuer à vendre en rupture de stock »

La fonctionnalité de retour en stock de Klaviyo ne fonctionne pas avec le paramètre Shopify « Continue selling when out of stock ». Si ce paramètre est activé, le produit apparaît toujours comme disponible, même avec un inventaire à zéro. Par conséquent :

• Le bouton « Prévenez-moi » et le formulaire de retour en stock n’apparaîtront pas.
• Aucun e-mail de retour en stock ne sera envoyé, car Klaviyo ne peut pas détecter quand le stock est réapprovisionné pour déclencher le flux.

Pour utiliser les fonctionnalités de retour en stock de Klaviyo, assurez-vous que « Continuer à vendre lorsque l’article est en rupture de stock » est désactivé pour ces produits.

Utilisez-vous le thème Retina ?

Un formulaire « Me prévenir » est intégré à la page produit dans le thème Retina (de Out of the Sandbox). Vous devrez désactiver le bouton par défaut de votre thème pour que le code Klaviyo fonctionne.

Utilisez-vous un thème qui masque un produit si toutes les variantes sont en rupture de stock ?

Si votre thème Shopify masque un produit lorsque toutes les variantes sont en rupture de stock, vous devrez identifier cette zone du code dans votre fichier product.liquid et la modifier pour afficher tous les produits, quel que soit leur stock.

Ressources supplémentaires