How To Add Sales Countdown Timer To Shopify Store

Comment ajouter un compte à rebours des ventes à Shopify Store

Comment ajouter un compte à rebours des ventes ?

Avant d'ajouter un compte à rebours des ventes à votre site Web Shopify, comprenons bien.

Pourquoi devriez-vous ajouter un compte à rebours à votre boutique Shopify ?

FOMO ! le mot définit la raison de lutilisation d'un compte à rebours sur les sites Web. Si vous nêtes pas familier avec ce mot, laissez-moi vous expliquer que « FOMO » signifie la « peur de passer à côt頻, une technique de marketing efficace utilisée pour créer un sentiment d'urgence.

FOMO triggers the human mind to act immediately. According to a phenomenon published by Computers in Human Behaviour, fear of missing out is a psychological trigger for humans. Because every human wants to go first, no one wants to be left behind.

Pourquoi utiliser FoMO en marketing ?

Selon Strategy Online,< span> 60 % des acheteurs de la génération Y ont déclaré effectuer un achat réactif après avoir rencontré le FOMO, le plus souvent dans les 24 heures. 67 % des milléniaux préfèrent faire leurs achats en ligne, 81,3 % déclarent effectuer des achats en ligne au moins une fois par mois et 45 % admettent préférer les achats en ligne.

Pour attirer un tel volume d'acheteurs en ligne, vous devez opter pour la méthode de marketing FOMO parmi tous les autres marketing.

Qu'est-ce qu'un compte à rebours des ventes ?

Un compte à rebours des ventes est une horloge qui affiche le temps restant pour acheter des produits avec une offre spéciale. Cette offre peut être une livraison gratuite, des soldes de saison, des remises ou d'autres récompenses.

L'ajout du compte à rebours des ventes à votre magasin crée un sentiment d'urgence dans l'esprit des acheteurs à chaque minute et à chaque seconde. Cela a un impact sur la décision d'achat des acheteurs avant la fin de l'offre.

Avantages de l'ajout d'un compte à rebours des ventes sur la boutique Shopify

Si vous gérez une boutique Shopify ou une entreprise de commerce électronique, vous voulez des ventes, des ventes et des ventes. Pour obtenir des ventes, vous appliquez toutes les stratégies de marketing, et l'une des méthodes qui aident est une stratégie de marketing appelée FOMO qui stimule positivement les ventes. L'ajout d'un compte à rebours des ventes augmente les ventes du magasin. Avec d'autres avantages tels que :

Créer l'urgence – 

Comme nous en avons déjà discuté, le compte à rebours crée l'urgence d'influencer la décision des acheteurs. Ils peuvent donc acheter le produit immédiatement.

Principe de raret頖 

Un compte à rebours déclenche une réaction humaine naturelle à la rareté. Il montre également la popularité et la demande des produits ou services. Vous pouvez également utiliser cette stratégie contrairement à la vente de produits peu demandés.

Augmenter la valeur – 

Une augmentation de la demande de produits augmente simultanément la valeur des produits. Vous pouvez donc vendre des produits à un prix beaucoup plus élevé et éventuellement augmenter vos revenus.

Susciter l'intérêt – 

La stratégie FOMO renforce l'intérêt des acheteurs même s'ils sont légèrement intéressés par les produits. Susciter l'intérêt des acheteurs est fructueux, car cela peut favoriser le partage social et l'adhésion aux réseaux sociaux.

Comment ajouter un compte à rebours des ventes à Shopify en utilisant le code

  1. Connectez-vous à votre interface administrateur Shopify et accédez à la boutique en ligne > Thèmes.
  2. Choisissez le thème que vous souhaitez modifier, puis cliquez sur Actions > Modifier le code.
  3. Maintenant, dans le répertoire des extraits, cliquez sur Ajouter un nouvel extrait.
  4. Nommez votre extrait comme compte à rebours et cliquez sur Créer un extrait.
  5. Après avoir créé un nouvel extrait, collez-y le code ci-dessous et enregistrez le fichier d'extrait.

% if end_date != blank %} 

 <div class=”timer”> 

   {% if title != blank %}<h4 class=”timer__title”>{{ title }}</h4>{% endif %} 

   <div class=”timer-display”> 

     <div class=”timer-block”> 

       <span class=”timer-block__num js-timer-days”>00</span> 

       <span class=”timer-block__unit”>Days</span> 

     </div> 

     <div class=”timer-block”> 

       <span class=”timer-block__num js-timer-hours”>00</span> 

       <span class=”timer-block__unit”>Hours</span> 

     </div> 

     <div class=”timer-block”> 

       <span class=”timer-block__num js-timer-minutes”>00</span> 

       <span class=”timer-block__unit”>Minutes</span> 

     </div> 

     <div class=”timer-block”> 

       <span class=”timer-block__num js-timer-seconds”>00</span> 

       <span class=”timer-block__unit”>Seconds</span> 

     </div> 

   </div> 

 </div> 

 <style> 

   .timer { 

     background: #f6fafd; 

     padding: 10px; 

     margin: 10px 0; 

   } 

   .timer–expired { 

     display: none; 

   } 

   .timer__title { 

     @extend .paragraph; 

     text-align: center; 

   } 

   .timer-display { 

     display: -webkit-box; 

     display: -ms-flexbox; 

     display: flex; 

     -ms-flex-wrap: wrap; 

         flex-wrap: wrap; 

     -webkit-box-pack: justify; 

         -ms-flex-pack: justify; 

             justify-content: space-between; 

     margin-top: 5px; 

   } 

   .timer-block { 

     position: relative; 

     width: 25%; 

     padding: 0 10px; 

     &:not(:last-child):after { 

       content: ‘:’; 

       position: absolute; 

       right: 0; 

       top: 3px; 

     } 

   } 

   .timer-block__num, 

   .timer-block__unit { 

     display: block; 

     text-align: center; 

   } 

 </style> 

 <script type=”text/javascript”> 

   var second = 1000, 

       minute = second * 60, 

       hour = minute * 60, 

       day = hour * 24; 

   var countDown = new Date(‘{{- end_date -}}’).getTime(), 

       x = setInterval(function() { 

       var now = new Date().getTime(), 

           distance = countDown – now; 

     document.querySelector(‘.js-timer-days’).innerText = Math.floor(distance / (day)), 

       document.querySelector(‘.js-timer-hours’).innerText = Math.floor((distance % (day)) / (hour)), 

     document.querySelector(‘.js-timer-minutes’).innerText = Math.floor((distance % (hour)) / (minute)), 

     document.querySelector(‘.js-timer-seconds’).innerText = Math.floor((distance % (minute)) / second); 

     }, second) 

 </script> 

 {% endif %} 

Votre extrait de code de compte à rebours est maintenant créé. Vous pouvez placer ce code à l'emplacement de votre choix, où il s'agit de la page d'accueil, de la page du produit ou de la page de collection. Incluez le fichier d'extrait de code suivant à l'endroit où vous souhaitez l'afficher.

 {% include ‘countdown-timer’, 

title: “Special Offer End In”, 

   end_date: “Dec 31, 2020” 

 %} 

Maintenant, cliquez sur enregistrer.

Remarque :

  • Vous pouvez facilement modifier le titre : paramètre en fonction de l'occasion, de la saison et des types d'offres.
  • Dans le paramètre end_date, vous devez le saisir avec précision au format : mois (abrégé), date, année et DOIT être dans le futur. Par exemple, la date d'aujourd'hui est le 15 octobre 2022, vous pouvez donc saisir : 15 octobre 2022.

Derniers mots :

Après avoir suivi les étapes ci-dessus, vous pouvez facilement ajouter le compte à rebours des ventes à la boutique Shopify. Mais d'une manière ou d'une autre, si vous rencontrez des difficultés pour le configurer. Ensuite, vous pouvez obtenir l'aide de notre développeur Shopify. Nous avons une équipe de développeurs Shopify qui sont experts dans la conception et le développement de Shopify.