Widget de devis flottant

Enable Quote Cart Widget : « Shows a floating button on your storefront so customers can open their quote cart from any page. »

Le widget est un bouton de devis rapide épinglé au bord de chaque page. Il fonctionne comme une icône de panier : dès que la personne a ajouté quelque chose, il indique combien de produits attendent, et un clic l’amène soit à la page du panier de devis, soit directement dans la fenêtre contextuelle de devis. Elle peut ainsi vérifier ce qu’elle a réuni et remplir le formulaire sans chercher la page.

L’activer

1. Ouvrir les paramètres du panier de devis

   Dans l’application, accédez à Quote settings et cliquez sur Customize, puis ouvrez l’onglet Quote cart page.

2. Activer Enable Quote Cart Widget

   Enable Quote Cart Widget est le dernier bloc de l’onglet, sous Enable Quote Sections. La commande est l’interrupteur à l’extrémité droite de son en-tête. Activez-le et le bloc se déploie pour afficher six paramètres.

   

3. Définir les six paramètres du widget

   Passez en revue Text, Action, Position, Border radius, Text color et Background color, chacun étant expliqué dans le tableau ci-dessous. Le panneau Preview à droite montre le widget au fil de vos modifications.

   

   Seulement deux couleurs à choisir : l’arrière-plan et le texte.

   

4. Enregistrer et vérifier votre vitrine

   Cliquez sur Save en haut à droite de l’éditeur, puis ajoutez un produit à un devis sur votre vitrine. Le widget apparaît au bord de l’écran, avec l’intitulé Quote suivi du nombre de produits entre parenthèses.

   

   Le widget tel que le voit la clientèle, sur chaque page de votre boutique.

   

Tous les paramètres du widget

Paramètre	Valeurs et valeur par défaut	Fonction
Text	Arrive sous la forme Quote ({numOfItem})	Le texte du widget. {numOfItem} est remplacé par le nombre de produits du devis de la personne, ce qui donne Quote (3). Si vous retirez le jeton, le widget affiche un simple libellé sans compteur.
Action	Go to quote cart page · Open quote popup	Ce que fait le clic sur le widget. Voir ci-dessous.
Position	Half bottom right · Bottom right · Half top right · Half bottom left · Bottom left · Half top left	Le bord auquel le widget est fixé, et sa hauteur. Les options « half » l'épinglent sur le côté de l'écran ; Bottom right et Bottom left le placent dans le coin.
Border radius	Un nombre en px, à partir de 0	L'arrondi des coins du widget. 0 donne des angles droits.
Text color	Une couleur	La couleur du texte.
Background color	Une couleur	La couleur du widget lui-même.

Note

Pas de champ Border radius ? Votre boutique utilise encore l’ancien code de vitrine de l’application, qui ne le propose pas. Tout le reste de la liste est disponible.

Où il amène la clientèle

Action en décide, et les deux valeurs se comportent différemment :

Action	Ce qui se passe au clic
Go to quote cart page	Le widget est un lien vers votre page de panier de devis, la page de la vitrine à l'adresse /pages/request-for-quote, qui « Shows the quote form and the customer's quote cart. » La personne quitte la page où elle se trouvait.
Open quote popup	La fenêtre contextuelle de devis s'ouvre par-dessus la page où la personne se trouve déjà. Elle ne perd jamais sa place dans votre catalogue.

La page du panier de devis et le widget se configurent dans le même onglet Quote cart page : le nom et le chemin de la page se trouvent donc juste au-dessus du bloc du widget.

Le choix dépend de la façon dont votre clientèle constitue un devis. Si elle rassemble plusieurs produits avant de demander, Go to quote cart page est préférable : la page du panier de devis affiche toute la liste avec les quantités, et c’est ce qu’elle veut vérifier. Si elle ajoute un seul produit et est prête à envoyer, Open quote popup lui évite un chargement de page.

Note

Le widget trouve toute son utilité lorsque Click action est défini sur Add product to quote cart : la clientèle rassemble des produits en naviguant, et le widget lui permet de retrouver la liste. Avec Open quote form popup, il compte beaucoup moins, car les demandes se terminent sur place. Voir Définir le comportement après le clic.

Où le widget n’apparaît pas

L’application masque le widget sur la page du panier de devis elle-même : il n’aurait aucune destination à proposer puisque la personne consulte déjà son devis. Partout ailleurs sur votre vitrine, il la suit.

Choisir les couleurs

Choisissez une Background color qui se démarque de vos pages sans concurrencer vos boutons d’achat, et une Text color suffisamment contrastée pour être lisible d’un coup d’œil. Vérifiez aussi sur téléphone : un élément flottant se dispute la place avec les bulles de chat en direct et les bandeaux de cookies ; assurez-vous que le vôtre reste lisible là où il se trouve. S’il entre en collision avec un autre élément, déplacez-le avec Position plutôt que de le désactiver : Half top right et Half top left se placent à l’écart des commandes de coin inférieur qu’utilisent la plupart des outils de chat.

Traduire le texte du widget

Tout ce que vous saisissez dans Text est du texte de vitrine : il passe donc par les traductions de l’application, comme le reste de ce que lit la clientèle. Définissez la formulation pour chaque langue à cet endroit plutôt que de vous contenter de l’anglais sur une boutique traduite : voir Traduire les textes de la vitrine.

Besoin d’aide ?

Si le widget entre en collision avec un autre élément de votre vitrine et que Position ne règle pas le problème, envoyez-nous une capture d’écran : voir Contacter l’assistance.

Étapes suivantes

• Définir le comportement après le clic : contrôlez ce qui se passe à l’ajout de produits
• Page Request a Quote : la page du panier de devis qu’ouvre le widget
• Page d’historique des devis : où la clientèle retrouve ses anciens devis