Load More Button

[RGJ (Richard - Communiteq)]

	Summary	Inserts a “load more” button that needs to be clicked to load more topics / posts / users / groups / whatever
	Preview	https://discourse.theme-creator.io/theme/RGJ/load-more-button
	Repository	GitHub - communiteq/discourse-tc-load-more-button · GitHub
	Install Guide	How to install a theme or theme component
	New to Discourse Themes?	Beginner’s guide to using Discourse Themes

Install this theme component

Inserts a “Load More” button to make sure Discourse does not qualify as “DISPLAYS ADDITIONAL MEDIA AT THE BOTTOM OF SUCH FEED OR LANDING PAGE WITHOUT ANY MANUAL INPUT FROM A COVERED USER.”

Context here Time to reconsider infinite scroll?

Topic list

Topic view

User directory

Detailed description…

[Lilly (Lillian)]

haha nice! i was thinking about giving this a shot too - was thinking of putting the button in the sidebar or floating it. well done

[Canapin (Coin-coin le Canapin)]

Button’s hard to reach with (right) thumb on mobile

It would be better centered.

[Lilly (Lillian)]

to centre on mobile:

@use "lib/viewport";

@include viewport.until(md) {

  .load-more-btn.btn.btn-primary {
    display: block;
    margin: 0 auto;   
  }
}

PR:

Centre the button horizontally in mobile view (#2)

[mcmcclur (Mark McClure)]

This is very nice - thanks! I do have a bug report which is clearly manifest at my Discourse site:

Discourse at Mark's Math

This site is quite small and most of the content is hidden until one signs on as a student. Thus, the landing page has only five posts. Nonetheless, the “Load more” button appears, which it shouldn’t. If you press it, it goes away. If you scroll up a bit and then back down, then it’s back again.

It works great, though, on the topic pages. You’ll have to trust me on that since they’re hidden from public view.

Of course, I understand that you did this in your spare time but I thought I should let you know. And thanks again!

[RGJ (Richard - Communiteq)]

@mcmcclur

Nonetheless, the “Load more” button appears, which it shouldn’t.

The button merely exposes a bug in core where DiscoveryTopics does not pass the canLoadMore model property to the LoadMore component. Unfortunately this is not something that can be handled in this theme component.

@Lilly

to centre on mobile:

Thank you, merged!

[eisammy (Sammy)]

That’s quite interesting. One question: does this affect Core Web Vitals? It’s almost like a middle ground for pagination. I like giving users the power to load more content, reducing reliance on DOM scrolling, while I assume it also results in slightly lower loading latency. Or am I mistaken?

[RGJ (Richard - Communiteq)]

All it does is insert a button into the flow. I don’t see how this reduces core web vitals, or loading latency (it’s not preloading anything). Also, it still uses the IntersectionObserver to know when and where the button needs to appear, so it still relies on DOM scrolling.

[Heliosurge (Dan DeMontmorency)]

@RGJ

@mcmcclur

Nonetheless, the “Load more” button appears, which it shouldn’t.

The button merely exposes a bug in core where DiscoveryTopics does not pass the canLoadMore model property to the LoadMore component. Unfortunately this is not something that can be handled in this theme component

Couldn’t they use some CSS to hide the button on the landing page for logged out users? For their use case?

I can appreciate this idea couldn’t be made part of the component directly as other sites have more than 5 topics display without a sign up.

Awesome component for the infinite scroll discussion as a fix.

[Lilly (Lillian)]

i have a fork of the component that already does this, but it’s an edge-case if mcmcclur wants. this component is quite hacky like RGJ said.

[Heliosurge (Dan DeMontmorency)]

Cool.

Something like this would be cool to have built into core that could be enabled for different areas ie topic list, user lists etc..

This component reminds me of the old “|more” from DOS days when using type to display a text file.