Comment afficher un message d'encouragement aléatoire dans Webflow ?

(function() {
  var messages = [
    { text: 'Construisez quelque chose dont vous serez fiers.', emoji: '🚀' },
    { text: 'Chaque grand site a commencé par une seule page.', emoji: '✨' },
    { text: "Le meilleur moment pour lancer était hier. Le deuxième meilleur, c'est maintenant.", emoji: '⚡' },
    { text: "Un bon design, c'est quand on ne le remarque pas.", emoji: '🎨' },
    { text: "La perfection est l'ennemie du bien. Publiez, itérez.", emoji: '🎯' },
    { text: 'Vos visiteurs ne lisent pas, ils scannent. Rendez ça facile.', emoji: '👀' },
    { text: 'La vitesse est une fonctionnalité. Chaque seconde compte.', emoji: '⚡' },
    { text: "Le meilleur CTA est celui que l'utilisateur remarque.", emoji: '🎯' },
  ];

  var el = document.getElementById('encouragement-msg');
  if (!el) return;

  function render(msg) {
    el.innerHTML = '<span style="font-size:24px;display:block;margin-bottom:8px;">' + msg.emoji + '</span>' +
      '<p style="font-size:15px;color:#111;line-height:1.6;margin:0;font-style:italic;">"' + msg.text + '"</p>';
  }

  render(messages[Math.floor(Math.random() * messages.length)]);

  setInterval(function() {
    var newMsg = messages[Math.floor(Math.random() * messages.length)];
    el.style.opacity = '0';
    el.style.transition = 'opacity 0.4s';
    setTimeout(function() {
      render(newMsg);
      el.style.opacity = '1';
    }, 400);
  }, 8000);
})();