[Resolved] Is it possible Infinite scroll?

[Author]

Posts

[Christos]

Is it possible to use infinite scroll instead of pagination in my search page (hidden link) ?
Notice: We use toolset blocks beta

[Christos]

Do you think that infinite scroll or show more button will affect the loading speed of the page?

[Waqar]

Hi,

Thanks for asking! I'd be happy to help.

Yes, Toolset Views support the infinite scrolling feature as explained in this guide:
https://toolset.com/documentation/user-guides/infinite-scrolling-in-views/

When using the new Blocks editor for views, you'll find the option for this in the pagination block's settings.

Screenshot: hidden link

Using the pagination or infinite scrolling should improve the page loading, compared to showing all the results at once.

I hope this helps.

regards,
Waqar

[Christos]

Hi Waqar,
Please can you check if i have setup the infinite scrolling in the right way ? You can see it here hidden link
1. How can i remove the pagination because i'm using infinite scrolling? hidden link
2. Why Spinner graphics, when loading more doesn't appear?
3. Is it possible the next results to load before scrolling at the end of the page?

Thank you in advance.

[Waqar]

Hi,

Thanks for writing back.

1. How can i remove the pagination because i'm using infinite scrolling? hidden link

- To remove the manual pagination controls, you can remove its block from the view's editor.

Screenshot: hidden link

2. Why Spinner graphics, when loading more doesn't appear?

- Your view is set to pre-load the next 3 pages when the page loads.

Screenshot: hidden link

This means that when the page will load, it will pre-load the results for pages 1-4 even though the results of page 1 will only be initially shown.

As a result, there will be minimum delay/wait when the results from the next pages will become visible. Since the total results available on that page are all covered within 4 pages, there is no wait time involved that needs to be covered through the spinner graphic.

Additionally, during testing on my own website, I noticed that when the new block's editor is being used, the default spinner graphics are not loaded, even when there is some wait time between the results.

I've shared these findings with the concerned team and will keep you updated with the progress through this ticket.

For now, a workaround can be to use a custom uploaded image as a spinner graphic, which loads fine.

Screenshot: hidden link

3. Is it possible the next results to load before scrolling at the end of the page?

- There are only two possible options that can be used in the pagination settings with infinite scrolling effect:

a). Pagination enabled with manual transition and AJAX:
This will trigger the next page's results when the page is scrolled to near its end.

b). Pagination enabled with automatic AJAX transition:
This will trigger the next page's results after the set time automatically and won't wait for the page's scrolling.

For any other customized control, you'll need to include custom JavaScript code.

regards,
Waqar

[Christos]

Hi, thanks for your help.

Could you please recheck the 1st issue. I can't have access to the setting of the infinite scroll if i remove pagination controls by this way. I just want to display to hide-not visible the pagination controls in the search page.

Thank you.

[Waqar]

The pagination settings should still be available from the view's context, even after the pagination block has been removed.

Screenshot: hidden link

Can you please remove that pagination block and then check the settings again?

[Christos]

My issue is resolved now. Thank you!

[Waqar]

Hi,

I'd like to share that a fix for the issue with the default spinner graphics has been included in the latest release of Toolset Views.

You're welcome to update and let us know through a new ticket, in case the issue still persists.

regards,
Waqar

[Christos]

Hi Waqar,
I installed the toolset blocks, but still the spinner doesn't appears.

Thank you