Scroll Infini PrestaShop — Guide d’installation et de configuration
Installer et configurer le scroll infini : modes de chargement, pagination SEO préservée, retour à la position exacte et thèmes personnalisés.
Installation
Scroll Infini PrestaShop s’installe comme n’importe quel module PrestaShop, sans dépendance ni bibliothèque tierce.
- Depuis le back-office, ouvrez Modules > Module Manager puis cliquez sur Installer un module.
- Sélectionnez le fichier
dfinfinitescroll-1.0.0.zipfourni et lancez l’installation. - Une fois installé, cliquez sur Configurer pour accéder aux réglages.
Le module n’ajoute aucune table en base de données et ne pose aucun override. La désinstallation ne laisse aucune trace.
Les trois modes de chargement
Le comportement du chargement se choisit dans le réglage Mode de chargement.
Hybride (recommandé)
Les premières pages se chargent automatiquement au fil du scroll, puis un bouton « Charger plus de produits » prend le relais une fois le seuil atteint. C’est le meilleur compromis : l’expérience reste fluide en haut de liste, mais le visiteur garde le contrôle et le pied de page redevient accessible.
Infini pur
Toutes les pages suivantes se chargent automatiquement dès que le bas de la liste approche, sans bouton. À réserver aux catalogues où l’accès au pied de page n’est pas critique.
Bouton uniquement
Aucun chargement automatique : le visiteur clique sur « Charger plus » à chaque page. Utile si vous voulez limiter le nombre de requêtes ou garder une pagination très explicite.
Réglages disponibles
- Mode de chargement — hybride, infini pur ou bouton seul.
- Pages chargées automatiquement (hybride) — nombre de pages chargées avant l’apparition du bouton. Valeur par défaut : 3.
- Synchroniser l’URL et le canonical — met à jour la barre d’adresse, la balise canonical et les liens rel prev/next au fil du scroll.
- Restaurer la position exacte — réinjecte les pages déjà vues et recale la vue sur le produit visité au retour d’une fiche.
- Activer sur toutes les pages de listing — catégories, fabricants, fournisseurs, recherche, meilleures ventes, nouveautés, promotions. Désactivé, le module ne s’applique qu’aux catégories.
- Libellé du bouton — texte multilingue du bouton « Charger plus ».
- Sélecteur de la liste produits (avancé) et Sélecteur de la pagination (avancé) — voir la section thèmes personnalisés.
La pagination reste optimisée pour le SEO
Contrairement aux modules qui remplacent la pagination par un appel AJAX invisible, Scroll Infini PrestaShop s’appuie sur les URLs paginées natives de votre thème. Concrètement :
- Sans JavaScript (robots inclus), la boutique affiche exactement votre pagination serveur habituelle, entièrement crawlable.
- Avec JavaScript, la balise canonical et les liens rel prev/next sont mis à jour pour refléter la page réellement affichée à l’écran, dans les deux sens de défilement.
Laissez l’option « Synchroniser l’URL et le canonical » activée : c’est elle qui garantit que l’URL partagée par un visiteur ayant scrollé jusqu’à la page 4 pointe bien vers cette page.
Le retour à la position exacte
C’est le cœur du module. Lorsqu’un visiteur clique sur un produit après avoir scrollé, le module enregistre dans le stockage de session : les pages chargées, l’URL exacte de chacune, la position de défilement et l’identifiant du produit cliqué. Il met aussi en cache le contenu des pages, avec un garde-fou de taille.
Au retour (bouton précédent du navigateur ou navigation interne depuis la fiche), le module :
- réinjecte instantanément les pages depuis le cache, ou les re-télécharge en parallèle si le cache était trop volumineux ;
- recale la vue précisément sur le produit visité, via son identifiant, avec repli sur la position de défilement.
L’état de restauration expire après 30 minutes et n’est jamais appliqué lors d’une visite directe sur une URL de type page 3 : dans ce cas, la page se comporte normalement.
Thèmes personnalisés : sélecteurs avancés
Par défaut, le module cible les sélecteurs du thème classic : #js-product-list .products pour la liste des produits et .pagination pour le bloc de pagination. Si votre thème utilise une structure différente, renseignez les deux champs avancés :
- Sélecteur de la liste produits — le conteneur direct des cartes produits.
- Sélecteur de la pagination — le bloc contenant le lien « suivant » (rel next ou classe next).
Aucune modification de code n’est nécessaire. Le module réattache les comportements des produits injectés via des événements applicatifs, ce qui permet à votre thème ou à d’autres modules de recâbler leurs widgets sur les nouvelles cartes.
Compatibilité avec la navigation à facettes
Le module est compatible avec le module de navigation à facettes. Il écoute l’événement de mise à jour de la liste produits déclenché à chaque changement de filtre, se réinitialise proprement et repart des URLs paginées filtrées. Aucun réglage supplémentaire n’est requis.
Dépannage
Le scroll infini ne se déclenche pas
Vérifiez que les sélecteurs avancés correspondent bien à votre thème, et qu’une pagination native (avec un lien « suivant ») est présente sur la page de listing.
Le retour ne recale pas sur le bon produit
Assurez-vous que les cartes produits de votre thème exposent bien l’attribut d’identifiant produit. Sur un thème très personnalisé qui ne l’expose pas, le module se replie sur la position de défilement.
En cas d’échec réseau
Le module bascule automatiquement sur les liens de pagination natifs : la navigation reste toujours possible.