Passer au contenu principal
Design et personnalisation

Comment ajouter une minuterie de compte à rebours

Une minuterie de compte à rebours affiche une horloge à côté de vos offres de bundle. Choisissez une durée fixe, minuit selon l'heure locale ou une échéance personnalisée, avec une mise en page en blocs de chiffres ou une barre compacte. La minuterie est un élément visuel : atteindre zéro ne désactive pas la remise et n'empêche pas les clients de la recevoir. Si une promotion doit prendre fin, gérez la remise séparément et utilisez une formulation correspondant à votre offre réelle.

Activer la minuterie de compte à rebours

Paramètres de la minuterie de compte à rebours avec la mise en page Compacte, la position Au-dessus du widget, une durée de 15 minutes et le comportement Afficher le message à l'expiration, à côté de l'aperçu de la minuterie.
(1) Activez la Minuterie de compte à rebours dans les modules complémentaires et choisissez la mise en page et la position. (2) Choisissez la durée. (3) Définissez l'état à l'expiration. Dans cet exemple, l'offre reste disponible lorsque la minuterie arrive à zéro.

La minuterie de compte à rebours se configure pour chaque offre de bundle, dans l'éditeur de bundle. Elle apparaît donc uniquement là où le widget de ce bundle est affiché.

  1. Ouvrez l'offre de bundle que vous souhaitez modifier.
  2. Ouvrez l'onglet Modules complémentaires et recherchez la section Minuterie de compte à rebours.
  3. Activez le bouton situé à côté du titre Minuterie de compte à rebours.
  4. Enregistrez le bundle.

Comme pour le reste du widget, l'intégration de votre application, ou le bloc d'application, doit être activé, et un bundle publié correspondant au produit doit être disponible pour que la minuterie s'affiche sur la boutique en ligne.

Choisir une mise en page

Le réglage Mise en page du compte à rebours contrôle l'apparence de la minuterie :

  • Complète - un bloc plus grand avec des chiffres distincts pour les jours, les heures, les minutes et les secondes, ainsi qu'un titre et un sous-titre facultatifs.
  • Compacte - une seule ligne fine qui combine un court message et la durée, à l'aide du champ Titre compact.

Définir la position

Le réglage Position détermine l'emplacement de la minuterie :

  • Au-dessus du widget - dans la page produit, juste au-dessus du bundle.
  • Sous le widget - dans la page produit, juste sous le bundle.
  • Barre fixe (haut) - fixée en haut de la fenêtre du navigateur. Cette option est disponible uniquement avec la mise en page Compacte.

Si vous passez à la mise en page Complète alors que la barre fixe est sélectionnée, la position revient automatiquement à Au-dessus du widget.

Choisir un type de minuterie

Sous Type de minuterie, choisissez le fonctionnement du compte à rebours :

  • Durée fixe - décompte d'un nombre défini de minutes pour chaque visiteur.
  • Se termine à minuit, heure locale de l'utilisateur - décompte jusqu'à minuit dans le fuseau horaire de chaque client, avec une nouvelle échéance quotidienne lors du chargement de la page le jour suivant.
  • Date de fin personnalisée - décompte jusqu'à une date et une heure précises que vous définissez.

Durée fixe

Lorsque vous sélectionnez Durée fixe, définissez la Durée en minutes. La valeur doit être comprise entre 1 et 1440 minutes, soit 24 heures. Le compte à rebours utilise l'heure locale du navigateur. Un actualisation de la page ne garantit donc pas au visiteur une nouvelle durée complète. Sur une page déjà ouverte, atteindre zéro applique le comportement d'expiration sélectionné. Ne comptez pas sur un redémarrage automatique de l'horloge sur cette page. Testez l'expiration et un chargement ultérieur de la page avant de publier votre formulation.

Date de fin personnalisée

Lorsque vous sélectionnez Date de fin personnalisée, choisissez la Date et heure de fin. L'éditeur affiche un fuseau horaire détecté à côté du champ. Vérifiez le compte à rebours sur vos marchés cibles, en particulier si vous avez besoin d'une échéance commune à plusieurs fuseaux horaires. La minuterie ne constitue pas un mécanisme d'application pour une promotion prenant fin dans le monde entier. Une fois l'échéance affichée dépassée, le comportement d'expiration sélectionné s'applique.

Définir ce qui se passe à la fin de la minuterie

Utilisez À la fin de la minuterie pour contrôler l'état à l'expiration :

  • Masquer la minuterie - le compte à rebours disparaît.
  • Afficher les zéros - le compte à rebours reste visible, figé à zéro.
  • Afficher le message - le compte à rebours est remplacé par un Message d'expiration que vous rédigez, par exemple : « La minuterie est terminée. Les offres restent disponibles. ».

Le comportement à l'expiration est également important pour une durée fixe. Lors de notre test d'une minute, le message est resté visible après zéro, tandis que la remise continuait de fonctionner dans le panier et lors du paiement.

Utiliser la variable {{timer}}

Dans le champ Titre compact, vous pouvez insérer la variable {{timer}} à l'endroit où vous souhaitez afficher la durée en direct. Par exemple :

Routine timer: {{timer}}

L'application remplace {{timer}} par le compte à rebours en cours. Le titre compact est également réutilisé dans la barre d'achat fixe lorsque Afficher le compte à rebours dans la barre fixe est activé. Veillez donc à le garder court et clair. Dans la mise en page Complète, vous stylisez séparément le titre, le sous-titre et les blocs de chiffres au lieu d'intégrer la durée dans une seule ligne. {{timer}} n'y est donc pas utilisé. Pour connaître les autres variables que vous pouvez utiliser dans le texte du widget, consultez Variables de modèle.

Styliser la minuterie

Sous les paramètres de comportement, vous pouvez harmoniser l'apparence avec celle de votre widget :

  • Appliquez un préréglage de couleur ou utilisez Harmoniser les angles du compte à rebours avec le widget principal pour aligner le rayon des angles sur celui de votre bundle.
  • Ouvrez Style du compte à rebours pour ajuster l'arrière-plan, le conteneur, notamment le remplissage, la bordure, l'ombre et l'alignement, ainsi que le texte. Dans la mise en page Complète, vous pouvez styliser séparément le titre, le sous-titre, les chiffres et les libellés des unités.

Lorsque vous définissez la position de la minuterie sur Barre fixe, les angles sont automatiquement droits, car une barre fixée en haut s'intègre mieux sans arrondi. Pour réutiliser le même compte à rebours dans la barre d'achat flottante, consultez Bouton d'achat fixe.

Enregistrer et tester le résultat

Page produit d'un sac à cosmétiques après l'expiration de la minuterie, avec le message d'expiration au-dessus des offres et dans la barre fixe flottante, et Acheter 2 à 43,20 $.
(1) Les deux minuteries affichent le message d'expiration. (2) L'offre sélectionnée coûte toujours 43,20 $ pour deux sacs Ivory Small. L'action Ajouter au panier de la barre fixe a continué de fonctionner après zéro.

Enregistrez la remise et ouvrez une page produit ciblée avec la remise active. Vérifiez la minuterie sur ordinateur et mobile. Pour tester rapidement l'expiration, utilisez temporairement une durée d'une minute et attendez zéro, puis rétablissez la durée souhaitée. Vérifiez l'état à l'expiration, puis utilisez Ajouter au panier et le paiement pour confirmer le comportement réel de l'offre.

Notre exemple utilise une minuterie compacte de 15 minutes au-dessus des offres. Le test d'une minute a confirmé que le message de la minuterie change à zéro, mais que deux sacs à 24 $ bénéficient toujours de 10 % de remise, pour un sous-total de marchandises de 43,20 $ dans le panier et lors du paiement. Les frais d'expédition sont séparés. Veillez à ce que la formulation de votre minuterie corresponde à ce comportement.

Cet article vous a-t-il été utile ?

Vos commentaires nous aident à améliorer notre documentation.

Merci, nous continuerons à améliorer cet article.

Vous souhaitez discuter avec notre équipe ? Vous avez encore une question ?

Vous avez encore besoin d’aide ?

Notre équipe est à un clic. Envoyez-nous un message et nous vous répondrons.

Nous utilisons quelques cookies pour assurer le fonctionnement de ce site, mesurer son utilisation et alimenter notre widget de chat lorsque vous l'ouvrez. Consultez notre politique relative aux cookies.