Aller au contenu

Easter egg2 min lecture

Comment afficher un texte selon l’heure dans Webflow ?

Apprenez à afficher un texte différent selon l'heure du jour dans Webflow : salutation dynamique et message par jour.

Dans ce tutoriel, Sandro cofondateur de l'agence Webflow Gemeos vous montre comment afficher un texte différent selon l'heure du jour dans Webflow.

Exemple

Selon votre heure locale

Chargement...

...

Plage horaireMessageID à utiliser
5h - 12h☀️ Bonjourtime-greeting
12h - 14h🍽️ Bon appétittime-greeting
18h - 22h🌙 Bonsoirtime-greeting
Selon le jourBon lundi, Bon vendredi...day-greeting

1. Ajoutez un ID sur votre texte dans Webflow

Sur votre Text Block : custom attribute Name = id, Value = time-greeting.

(function() {
  function getGreeting() {
    var h = new Date().getHours();
    if (h >= 5 && h < 12) return '☀️ Bonjour';
    if (h >= 12 && h < 14) return '🍽️ Bon appétit';
    if (h >= 14 && h < 18) return '🌤️ Bonne après-midi';
    if (h >= 18 && h < 22) return '🌙 Bonsoir';
    return '⭐ Bonne nuit';
  }
  var el = document.getElementById('time-greeting');
  if (el) el.textContent = getGreeting();

  var dayEl = document.getElementById('day-greeting');
  var days = ['Bon dimanche', 'Bon lundi !', 'Bon mardi', 'Bonne mi-semaine',
    'Presque le weekend 🙌', 'Bon vendredi !', 'Bon samedi ☀️'];
  if (dayEl) dayEl.textContent = days[new Date().getDay()];
})();

Conclusion

Un détail de personnalisation qui crée une connexion immédiate avec le visiteur.

Publié le 19 mai 2026

Sandro DA SILVA

Growth Marketer, expert Webflow et touche à tout. Sandro s'occupe des opérations commerciale, veille au bon déroulement des projets et s’occupe des problématiques liées au marketing (SEO, Tracking, Copywriting, etc)

Vous allez notre collaboration, c’est garanti

Prêt à faire décoller votre activité ?

demander un devis

Let’s f*****G GO !!