Add Pagination to a Grid Post Block

Hi @bam-bam,
Nice, thanks for following that tutorial!

Hm, did you have in mind JavaScript-driven pagination, like where you click ‘Next’ and it shows the next posts?

• This reply was modified 4 years, 7 months ago by Ryan Kienstra.

Something like that, PHP and JS are not my strong points, same kind of thing you would normally see on a WordPress Blog page.

So maybe show 4 posts and when next is clicked, you get the next 4 or whatever is available.

I have them showing 4 wide on the page at the moment.

Bam Bam

Hi @bam-bam,
That sounds interesting.

As a basic implementation, you might create the block with 2 pages initially, and add a class to the second to hide it.

On clicking a ‘Next’ button, it could hide the first block, and show the next.

Not sure how to go about it, but where there is a will there is generally a way, been playing around with JS a bit lately, may be able to do something with that.

Haha, good way to put it ??

You could add a click event listener to the ‘Next’ button that would remove the class that hid the next page.

That class might have a style rule display: none

If it’s alright, I’m going to close this topic.

• This reply was modified 4 years, 7 months ago by Ryan Kienstra.
• This reply was modified 4 years, 7 months ago by Ryan Kienstra.
• This reply was modified 4 years, 7 months ago by Ryan Kienstra.

May as well if there is no easier way to do it in the block itself.

Sorry, there’s no built-in way to do that in Block Lab.

On reflection I might duplicate the block and modify it to show all posts instead of only the 4 most recent and add a button to the current one that says Read older posts and direct it to another page.

That sounds good!