Saltar navegación

[Resuelto] Pagination in blocks based archive view

Este hilo está resuelto. Aquí tiene una descripción del problema y la solución.

Problem:

Force Ajax pagination to scroll to a certain place on the page

Solution:

Add the Javascript below to your theme:

jQuery( document ).on( 'js_event_wpv_pagination_completed', function( event, data ) {
        jQuery([document.documentElement, document.body]).animate({
        scrollTop: jQuery(".js-wpv-loop-wrapper .tb-grid-column:nth-child(1)").offset().top
    }, 300);
});

Change the selector in the code depending on your needs.

This support ticket is created hace 2 años, 4 meses. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Este tema contiene 2 respuestas, tiene 2 mensajes.

Última actualización por Stephen Vaughan hace 2 años, 4 meses.

Asistido por: Christopher Amirian.

Autor
Mensajes
#2440981
Screenshot 2022-08-19 at 3.10.46 p.m..png

Hi,

I have set up a view built with block with pagination applied loading with AJAX. I notice that when the user selects the next page that the next listings of posts doesn't scroll to the top item. The attached image demonstrates that they are left viewing the bottom of the view archive. Not sure if this is specific to views built with blocks?

enlace oculto

I did some digging around in Toolset support an eventually found the following jQuery:

jQuery( document ).on( 'js_event_wpv_pagination_completed', function( event, data ) {
jQuery("html, body").animate( {scrollTop: 0}, "fast");
});

This works somewhat but, as you can see, the page leads with some blurb and images so the scroll top doesn't land on the archive, but rather above it. Is there some sort of offset I can use here?

#2441795

Christopher Amirian
Supporter

Idiomas: Inglés (English )

Hi there,

Would you please replace the code that you mentioned with this one?

jQuery( document ).on( 'js_event_wpv_pagination_completed', function( event, data ) {
        jQuery([document.documentElement, document.body]).animate({
        scrollTop: jQuery(".js-wpv-loop-wrapper .tb-grid-column:nth-child(1)").offset().top
    }, 300);
});

See if it helps.

#2442021

Thanks Christopher,

That did the trick. I changed the anchor slightly as there is a fixed top navigation and the scroll was landing the top of the archive underneath. I anchored to the class of the bottom two images in the gallery at the start of the page to compensate for this. The last two photos lans in the viewers sight when paginating but this is OK as it gives toe user some context of where they are on the page.