CMS - Afficher un item aléatoire
CMS - Afficher un item aléatoire

CMS - Afficher un item aléatoire

Sommaire

Présentation

Imagine. À chaque chargement de la page, un nouvel élément aléatoire est affiché. Un article au hasard, un produit au hasard, une animation Lottie au hasard.

C'est possible avec les données du CMS et un peu de custom code. Let's gooo. 🤯

Étapes

  • Avoir une collection dans le CMS avec les datas que l'on veut afficher aléatoirement
  • Ajouter cette Collection List sur une page statique ou dynamique
  • Connecter la Collection que l'on veut afficher.
  • Mettre nos éléments dans le Collection Item sur la page
  • Donner une .class à notre Collection Item
  • Passer notre Collection Item en display:none
  • Ajouter le Custom Code dans "Before </body> tag" dans les Page Settings
  • Remplacer taclass par la .class que tu as donné à ton Collection Item Attention: Bien faire attention à garder le point avant la .class et les '
  • Sauvegarder et publier.

Vidéo

Code Nécessaire

<script>
var items = $('.taclass');
items.eq(Math.floor(Math.random() * items.length)).show();
</script>

image

Apprends à créer un site moderne, dynamique et intègre les meilleurs outils du marché dans Webflow. Rejoins la formation sans attendre & Maitrise Webflow très rapidement.

-20% offert avec le code WIKI20 (valable sur les paiements en 1x et 4x)