Skip to main content
Ce guide vous explique comment configurer et placer les widgets de checkout dans Aftersell, de l’activation des widgets à l’optimisation du placement dans Shopify Checkout pour des taux de conversion maximaux.. Remarque : Les widgets de checkout ne sont disponibles que pour les marchands Shopify Plus en raison des restrictions de l’API Checkout Extensibility de Shopify.

Étape 1 : Activer votre widget dans Aftersell

Avant d’ajouter des widgets à votre checkout, vous devez les activer dans l’interface administrateur Aftersell.
  1. Accédez à l’onglet Checkout dans votre interface administrateur Aftersell
  2. Sélectionnez le type de widget que vous souhaitez configurer (Upsells, Cart Controls, Rewards, Trust Badges, Testimonials, Notes, Images ou Text)
  3. Cliquez sur Create pour créer un nouveau widget ou sélectionnez un widget existant à modifier
  4. Configurez les paramètres de votre widget (voir Types de widgets et configuration ci-dessous)
  5. Cliquez sur le bouton Enable dans le coin supérieur droit des paramètres du widget
  6. Pour les upsells restreints ou avancés, assurez-vous d’activer les déclencheurs personnalisés avant de continuer

Étape 2 : Ouvrir l’éditeur de checkout Shopify

Il existe deux façons d’accéder à l’éditeur de checkout Shopify : Option 1 : Depuis l’interface administrateur Shopify
  1. Allez dans Settings dans votre interface administrateur Shopify
  2. Cliquez sur Checkout dans la navigation de gauche
  3. Cliquez sur Customize à côté du profil de checkout souhaité
Option 2 : Depuis Aftersell
  1. Cliquez sur le bouton Open Shopify Checkout Editor en bas à droite de la page de l’éditeur Checkout d’Aftersell
💡 Astuce : L’option 1 vous donne plus de contrôle sur le profil de checkout que vous modifiez. Nous recommandons de tester d’abord sur une version brouillon avant de la mettre en ligne.

Étape 3 : Ajouter le bloc d’application à votre checkout

  1. Dans l’éditeur de checkout Shopify, cliquez sur Add app block
  2. Sélectionnez le widget Aftersell souhaité dans la liste des widgets disponibles
  3. Choisissez le bon placement pour votre widget (voir Options de placement ci-dessous)
  4. Si vous souhaitez que vos widgets s’affichent dans le checkout Shop Pay, cochez l’option Include app block in Shop Pay
  5. Cliquez sur Save dans le coin supérieur droit

Étape 4 : Positionner votre widget

  1. Faites glisser-déposer le bloc d’application à l’endroit souhaité dans la zone de placement sélectionnée
  2. Cliquez sur Save dans le coin supérieur droit

Types de widgets et configuration

Placements

Les placements sont créés dans l’éditeur Checkout d’Aftersell et vous permettent de faire fonctionner plusieurs widgets du même type sur la même page de checkout. Par exemple, si vous souhaitez afficher deux offres d’upsell sur la même page, chacune doit être attribuée à un placement différent.

Placements disponibles

  • Default placement : Le placement principal. Chaque type de widget commence ici.
  • Additional placement 1 : Un second emplacement de placement pour afficher un autre widget du même type sur la même page.
  • Additional placement 2 : Un troisième emplacement de placement pour une séparation supplémentaire.
Vous pouvez également créer de nouveaux placements directement depuis le menu déroulant des placements dans Aftersell en sélectionnant + Add new placement.

Quand utiliser plusieurs placements

Utilisez plusieurs placements lorsque vous souhaitez :
  • Afficher plus d’un widget du même type sur une seule page de checkout
  • Afficher des widgets dans différentes sections de la page
  • Cibler différentes audiences avec différentes offres
  • Faire fonctionner des widgets avec des déclencheurs similaires ou qui se chevauchent
Aftersell utilise un système de priorité. Vous ne pouvez pas faire fonctionner plusieurs widgets avec des déclencheurs identiques au sein du même placement. Si deux widgets partagent les mêmes conditions de déclenchement dans un placement, un seul s’affichera selon la priorité. Pour utiliser des déclencheurs similaires, attribuez chaque widget à un placement différent afin qu’ils puissent fonctionner indépendamment sans conflit.

Faire correspondre les placements dans l’éditeur de checkout Shopify

Chaque placement dans Aftersell correspond à un bloc d’application distinct dans l’éditeur de checkout Shopify. Le placement sélectionné dans Shopify doit correspondre au placement défini dans Aftersell. Par exemple, si un widget est attribué à Additional placement 1 dans Aftersell, le bloc d’application dans Shopify doit également être défini sur Additional placement 1. Si les placements ne correspondent pas, le widget peut ne pas apparaître ou s’afficher au mauvais endroit. Important : Une incohérence de placement est l’une des raisons les plus courantes pour lesquelles un widget ne s’affiche pas. Si un widget n’apparaît pas, confirmez que le placement correspond à la fois dans Aftersell et dans Shopify avant de poursuivre le dépannage.

Upsells

Proposez des produits aux clients pendant le checkout pour augmenter votre valeur moyenne de commande (AOV). Options de configuration : Modes de widget :
  • Single Product Upsell : Affichez un produit avec un bouton Add to Cart
  • Multi-Product Upsell : Affichez plusieurs produits dans une disposition en pile ou en carrousel, permettant aux clients d’accepter plusieurs offres
  • Checkmark Upsell : Affichez un seul produit avec une case à cocher au lieu d’un bouton Add to Cart (idéal pour les ajouts à faible coût comme la protection d’expédition)
Méthodes de sélection de produits :
  • Specific Products : Sélectionnez manuellement les produits individuels à proposer en upsell
  • Collection : Sélectionnez une collection et affichez jusqu’à 5 produits aléatoires (les produits déjà dans le panier sont automatiquement exclus)
  • AI Recommendations : Recommandez automatiquement des produits en fonction du contenu du panier
  • Most Expensive Product : Proposez automatiquement en upsell le produit le plus cher du panier
  • Spend Threshold : Recommandez des produits qui aident les clients à atteindre les seuils de récompense (nécessite une barre de récompenses)
Fonctionnalités supplémentaires :
  • Ajoutez des remises directement dans le widget
  • Verrouillez les plans d’abonnement sur des options spécifiques
  • Affichez les étoiles d’avis produits (nécessite une application d’avis compatible)
  • Définissez un nombre maximum d’offres acceptées par widget (types Single et Multi upsell uniquement)
En savoir plus sur les widgets d’upsell

Cart Controls

Permettez aux clients de modifier leur panier directement sur la page de checkout. Contrôles disponibles :
  • Variant selector : Changer pour une autre variante en stock
  • Quantity selector : Ajuster les quantités de produits
  • Remove item : Supprimer des produits d’upsell du panier
  • Subscription selector : Changer la fréquence d’abonnement
  • Subscription upgrade : Passer des achats ponctuels à des abonnements
  • Custom text : Ajouter du texte personnalisé sous les lignes d’articles
Ciblage des produits :
  • Appliquer à tous les produits du panier
  • Appliquer uniquement aux produits sélectionnés
  • Appliquer à tous les produits sauf ceux sélectionnés
Fonctionnalités supplémentaires :
  • Afficher les étoiles d’avis produits pour les produits du panier
En savoir plus sur les contrôles du panier

Rewards

Affichez une barre de progression montrant aux clients à quel point ils sont proches d’obtenir une récompense. Options de configuration :
  • Type d’objectif : Order Value ou Item Count
  • Base du montant (pour les objectifs Order Value) : Order total, Subtotal ou Post-discount subtotal
  • Message et style de la récompense
  • Couleurs et design de la barre de progression
Bonnes pratiques :
  • Associez-la à des widgets d’upsell pour aider les clients à atteindre les seuils de récompense
  • Utilisez le type de produit spend threshold dans les upsells pour recommander automatiquement des produits qui comblent l’écart
  • Créez des récompenses dans Shopify à l’aide des Automatic Discounts (pour les récompenses de remise) ou des Shipping Rules (pour la livraison gratuite)
  • Utilisez Post-discount subtotal comme base du montant lorsque vous offrez la livraison gratuite, afin que la barre corresponde à l’évaluation du seuil par Shopify lorsque des codes de réduction sont appliqués
En savoir plus sur les récompenses

Trust Badges

Instaurez la confiance avec des icônes et du texte personnalisés pour augmenter les taux de conversion au checkout. Options de configuration :
  • Disposition des badges : Pile verticale ou affichage horizontal
  • Icônes et texte personnalisés pour chaque badge
  • Options de style et d’espacement
Bonnes pratiques :
  • Mettez en avant les fonctionnalités de sécurité (checkout sécurisé, chiffrement SSL)
  • Présentez les garanties (garantie de remboursement, retours gratuits)
  • Affichez les avantages d’expédition (livraison gratuite, livraison rapide)
En savoir plus sur les badges de confiance

Testimonials

Affichez des avis clients directement au checkout pour instaurer la confiance. Options de configuration :
  • Flex Testimonials (recommandé) : Récupère automatiquement de vrais avis depuis votre application d’avis (Judge.me, Klaviyo, Okendo ou Yotpo)
  • Mode de sélection : Manual (choisir des avis spécifiques) ou Dynamic (récupérer automatiquement les avis en fonction du contenu du panier)
  • Type d’affichage : Carrousel horizontal ou pile verticale
  • Filtre de note minimale
Prérequis de configuration :
  • Configurez les identifiants de l’application d’avis dans Settings > Product Reviews
  • Les avis se synchronisent automatiquement sous 24 heures, puis chaque semaine
En savoir plus sur les témoignages

Notes

Permettez aux clients d’ajouter des notes à leur commande. Options de configuration :
  • Notes manuelles : Champ de texte libre pour la saisie du client
  • Notes pré-rédigées : Cases à cocher pour des options comme l’emballage cadeau ou l’emballage écologique
En savoir plus sur les notes

Images

Téléversez et affichez des images personnalisées dans votre checkout. Options de configuration :
  • Téléversement d’image
  • Curseur d’ajustement de la largeur
  • Aucune exigence de taille minimale
En savoir plus sur les images

Text

Insérez une bannière avec du texte personnalisé dans votre checkout. Options de configuration :
  • Quatre styles de bannière :
    • Information : Fond bleu avec icône d’information
    • Success : Fond vert avec icône de coche
    • Critical : Fond rouge avec icône de point d’exclamation
    • Warning : Fond jaune avec icône de triangle d’avertissement
  • Ajustements de la taille de l’en-tête, de la taille du contenu et de l’espacement
En savoir plus sur le texte

Dépannage

Les widgets ne s’affichent pas

Si vos widgets ne s’affichent pas après la configuration :
  1. Vérifiez que le widget est activé dans l’interface administrateur Aftersell
  2. Vérifiez que le bloc d’application est ajouté dans l’éditeur de checkout Shopify
  3. Confirmez que le bloc d’application est enregistré dans l’éditeur de checkout Shopify
  4. Vérifiez que le bon placement est sélectionné. Lors de l’ajout d’un bloc d’application dans l’éditeur de checkout Shopify, vous devez choisir le placement correspondant, tel que Default placement, Additional placement 1 ou Additional placement 2. Si le mauvais placement est sélectionné, le widget peut ne pas apparaître ou s’afficher au mauvais endroit. Supprimez le bloc d’application et rajoutez-le, en vous assurant que le placement prévu est sélectionné.
  5. Pour Shop Pay : Vérifiez que « Include app block in Shop Pay » est coché
  6. Videz le cache du navigateur ou essayez le mode incognito
  7. Attendez quelques minutes que les modifications se propagent

Les widgets Shop Pay ne s’affichent pas

Pour afficher les widgets dans le checkout Shop Pay :
  1. Ouvrez le widget dans l’éditeur de checkout Shopify
  2. Cochez l’option Include app block in Shop Pay sous Checkout behaviour
  3. Enregistrez vos modifications
En savoir plus sur les widgets Shop Pay

Prochaines étapes