Ajouter un loader animé qui s’affiche entre chaque page

Tuto exclusif Design Développement module

⚡ Offrez une expérience de navigation plus fluide grâce à un loader animé élégant qui s’affiche entre chaque page. Idéal pour dynamiser l'interface 🚀

Réservé aux abonnés

S’abonner favorite_border

Modes de paiement disponibles :

À partir de 500€ d'achat :

Paiement en 3 x sans frais avec Klarna & Virement bancaire

A propos de ce contenu

  • Durée 8 min
  • Thématique Design Développement module
  • Type de formation Technique
  • Niveau MOYEN

Nous sommes là pour vous aider

Vous avez des questions sur ce contenu ?

contact_support Posez-nous toutes vos questions

Description

Tuto PrestaShop : Ajouter un loader animé qui s’affiche entre chaque page.

🌀 Ce tuto vous apprendra à créer un module qui ajoute un loader animé entre les pages de votre boutique PrestaShop pour améliorer la fluidité de navigation.

Lorsqu’un visiteur clique sur un lien interne, une animation s’affiche immédiatement jusqu’au chargement de la nouvelle page.

Léger, 🎨 esthétique et sans dépendance externe, ce module améliore la perception de rapidité, notamment sur mobile.

💡 Idéal pour offrir une expérience utilisateur professionnelle sans modifier votre thème ni impacter les performances.

Structure du module (pensez à l'adapter avec vos informations) :

-------------------

yourmodulename.php :

   

-------------------

views/css/yourmodulename.css :

-------------------

views/js/yourmodulename.js :

UPDATE : Ajoutez cette ligne de code à votre fichier JS de façon à éviter l'affichage infini du loader lors de la mise à jour du contenu du panier :

      // Prevent loader for cart item removal actions

      if (link.closest('.cart-line-product-actions')) return;

-------------------

views/templates/hook/displayFooter.tpl :

Avis

Aucun avis n'a été publié pour le moment.