[Résolu] How to add a « Load more » button

[Auteur]

Publications

[arisG]

Hello,

We use a WordPress Archive with infinite scroll enable but with "Infinite scrolling tolerance, in pixels" setting to -500 in order to prevent auto scroll and add a load more button.

Reference : https://toolset.com/forums/topic/load-more-button-3/

We have seen strange behave. In some developers, infinite is disabled and to some other infinite works.

We have tried the following without success.

- Incognito chrome
- Different browsers
- Disable Litespeed caching
- Disable Cloudflare

Does Toolset have any caching mechanism by itself?

[Nigel Supporter Languages: Anglais (English ) Espagnol (Español ) Timezone: Europe/London (GMT+01:00)]

Toolset includes quite a bit of internal caching to speed up queries for post meta and for posts, but nothing that should influence this. You'll also notice in the advanced settings for the pagination where you added the -500 tolerance settings to cache and preload pages.

I just tested this solution locally and didn't experience any problems, although because of the large footer on the test site using twentynineteen theme I had to change the tolerance to a bigger negative number, i.e. 5000.

Can you clarify what doesn't work?

I set that tolerance so that the infinite scroll itself never works, only the load more button works, but you could choose a tolerance level where if you scrolled a little bit past the results there would be no infinite scroll triggered and it would need to be triggered manually with the load more button.

Could that be the problem, that on some different screen sizes the load more button works as well as infinite scroll, and on others only the load more button works?

[arisG]

For Testing reasons we have done the following :

- we have created a new clean WordPress Archive for testing.
- we have added in WordPress setting, "Your homepage displays" as Latest Posts
- we have added "Infinite scrolling tolerance, in pixels" setting to -10000
- we have added a Load More button with <div class="load-more">[wpv-pager-next-page force="true"]Load more...[/wpv-pager-next-page]</div>

In some devs infinite works from the first page and in one specific dev in first-page use Load More button, in second page infinite and then only infinite. I can't understand what is going on.

I can provide Credentials in our Demo environment if you want.

[Nigel Supporter Languages: Anglais (English ) Espagnol (Español ) Timezone: Europe/London (GMT+01:00)]

Sure, let me see what you mean on your site, I have set up a private reply.

Please be sure to detail each place where I should be testing this and what I should expect to see in each case.

[Nigel Supporter Languages: Anglais (English ) Espagnol (Español ) Timezone: Europe/London (GMT+01:00)]

On your site I found that the load more button works on both pages, but that the infinite scroll also happens automatically.

But only when scrolling to the very bottom of the page and actually hitting the bottom.

You have a very small footer, so that is easily done.

On my local test site where I'm using twentynineteen the default footer is quite large, which is why I wasn't noticing the same result. So one solution is to make a bigger footer so that the infinite scroll isn't accidentally triggered.

I don't know whether this reflects browser behaviour, or is related to how this is coded.

But I know that it's not a bug, as adding infinite scroll it is expected that you would use infinite scroll, whereas you are trying to trick Views into providing a load more button, functionality which isn't currently available.

So the best solution—apart from the "hack" of making a longer footer—would be to request support for a Load More button, which you can do here: https://toolset.com/home/contact-us/suggest-a-new-feature-for-toolset/

[arisG]

So, officially is not supported the Load More Button as I Understand. We just try to simulate the functionality with workarounds. I have read in toolset support forum that Load More functionality is already open as a feature request.

We have made a longer footer but again the infinite scroll triggered in some cases. Also, we noticed different behavior per developers. It's something that we can't rely on it.

We managed to resolve the problem by disabling the auto load more with the following code we found in the forum

jQuery(function($){
WPViews.view_pagination.is_infinite_triggable = function(view_layout){return false; }
});

Thank you for your help.