PS PrestaShop Beginner

Oneindig Scrollen PrestaShop: volledige gids

Installatie en configuratie van het oneindig scrollen: laadmodi, behouden SEO-paginering, terugkeer naar de exacte positie en aangepaste thema's.

Bijgewerkt Moduleversie 1.0.0

Installatie

Oneindig Scrollen PrestaShop wordt geïnstalleerd als elke andere PrestaShop-module, zonder afhankelijkheid of externe bibliotheek.

  1. Open vanuit de back-office Modules > Module Manager en klik op Een module installeren.
  2. Selecteer het meegeleverde bestand dfinfinitescroll-1.0.0.zip en start de installatie.
  3. Klik na de installatie op Configureren om de instellingen te openen.

De module voegt geen enkele databasetabel toe en plaatst geen enkele override. Het deïnstalleren laat geen sporen achter.

De drie laadmodi

Het laadgedrag kiest u via de instelling Laadmodus.

Hybride (aanbevolen)

De eerste pagina’s laden automatisch tijdens het scrollen, waarna een knop “Meer producten laden” het overneemt zodra de drempel is bereikt. Dit is het beste compromis: de ervaring blijft vlot bovenaan de lijst, maar de bezoeker houdt de controle en de footer blijft bereikbaar.

Puur oneindig

Alle volgende pagina’s laden automatisch zodra het einde van de lijst nadert, zonder knop. Voor te behouden aan catalogi waar de toegang tot de footer niet kritiek is.

Alleen knop

Geen automatisch laden: de bezoeker klikt bij elke pagina op “Meer laden”. Nuttig als u het aantal verzoeken wilt beperken of een zeer expliciete paginering wilt behouden.

Beschikbare instellingen

  • Laadmodus — hybride, puur oneindig of alleen knop.
  • Automatisch geladen pagina’s (hybride) — aantal geladen pagina’s voordat de knop verschijnt. Standaardwaarde: 3.
  • URL en canonical synchroniseren — werkt de adresbalk, de canonical-tag en de rel prev/next-links bij tijdens het scrollen.
  • Exacte positie herstellen — injecteert de al bekeken pagina’s opnieuw en lijnt de weergave uit op het bezochte product bij terugkeer vanaf een productpagina.
  • Inschakelen op alle overzichtspagina’s — categorieën, fabrikanten, leveranciers, zoekresultaten, bestsellers, nieuwigheden, aanbiedingen. Uitgeschakeld geldt de module alleen voor categorieën.
  • Knoplabel — meertalige tekst van de knop “Meer laden”.
  • Selector van de productlijst (geavanceerd) en Selector van de paginering (geavanceerd) — zie de sectie over aangepaste thema’s.

De paginering blijft SEO-geoptimaliseerd

In tegenstelling tot modules die de paginering vervangen door een onzichtbare AJAX-aanroep, steunt Oneindig Scrollen PrestaShop op de native gepagineerde URL’s van uw thema. Concreet:

  • Zonder JavaScript (robots inbegrepen) toont de winkel exact uw gebruikelijke serverpaginering, volledig crawlbaar.
  • Met JavaScript worden de canonical-tag en de rel prev/next-links bijgewerkt zodat ze de daadwerkelijk getoonde pagina weerspiegelen, in beide scrollrichtingen.

Laat de optie “URL en canonical synchroniseren” ingeschakeld: zij garandeert dat de URL die een bezoeker deelt na tot pagina 4 te hebben gescrold, ook echt naar die pagina verwijst.

De terugkeer naar de exacte positie

Dit is de kern van de module. Wanneer een bezoeker na het scrollen op een product klikt, slaat de module in de sessieopslag op: de geladen pagina’s, de exacte URL van elk ervan, de scrollpositie en de identifier van het aangeklikte product. Ze cachet ook de inhoud van de pagina’s, met een groottelimiet als veiligheidsgrens.

Bij terugkeer (terugknop van de browser of interne navigatie vanaf de productpagina) doet de module het volgende:

  1. ze injecteert de pagina’s onmiddellijk opnieuw vanuit de cache, of downloadt ze parallel opnieuw als de cache te groot was;
  2. ze lijnt de weergave precies uit op het bezochte product, via zijn identifier, met terugval op de scrollpositie.

De herstelstatus verloopt na 30 minuten en wordt nooit toegepast bij een direct bezoek aan een URL van het type pagina 3: in dat geval gedraagt de pagina zich normaal.

Aangepaste thema’s: geavanceerde selectors

Standaard richt de module zich op de selectors van het classic-thema: #js-product-list .products voor de productlijst en .pagination voor het pagineringsblok. Als uw thema een andere structuur gebruikt, vul dan de twee geavanceerde velden in:

  • Selector van de productlijst — de directe container van de productkaarten.
  • Selector van de paginering — het blok met de link “volgende” (rel next of class next).

Er is geen codewijziging nodig. De module koppelt de gedragingen van de geïnjecteerde producten opnieuw via applicatie-events, waardoor uw thema of andere modules hun widgets op de nieuwe kaarten kunnen heraansluiten.

Compatibiliteit met facetnavigatie

De module is compatibel met de module voor facetnavigatie. Ze luistert naar het update-event van de productlijst dat bij elke filterwijziging wordt geactiveerd, reset zichzelf netjes en vertrekt opnieuw vanaf de gefilterde gepagineerde URL’s. Er is geen extra instelling vereist.

Probleemoplossing

Het oneindig scrollen wordt niet geactiveerd

Controleer of de geavanceerde selectors overeenkomen met uw thema, en of er op de overzichtspagina een native paginering (met een link “volgende”) aanwezig is.

De terugkeer lijnt niet uit op het juiste product

Controleer of de productkaarten van uw thema het attribuut met de productidentifier blootstellen. Op een sterk aangepast thema dat dit niet doet, valt de module terug op de scrollpositie.

Bij een netwerkfout

De module schakelt automatisch over op de native pagineringslinks: navigeren blijft altijd mogelijk.

Was deze pagina nuttig?

Loopt u nog vast? Neem contact op met support