Blog Pagination not working

Question

Blog Pagination is not working.

I have 2 test posts. I set pagination to 1 post per page.

It displays all posts on the first page, and creates pagination buttons.

Clicking pagination buttons changes the url but posts and pages remain the same.

HTML

{# Blog Post List #}
<ul class="post-list">
    {% for post in filteredPosts %}
    <li>
        <h3><a href="/blog/{{ post.slug }}">{{ post.title }}</a></h3>

        <p class="info">
            Posted
            <!--{% if post.categories.count %} in {% endif %}
            {% for category in post.categories %}
                <a href="{{ category.url }}">{{ category.name }}</a>{% if not loop.last %}, {% endif %}
            {% endfor %}-->
            on {{ post.published_at|date('M d, Y') }}
        </p>

        <p class="excerpt">{{ post.summary|raw }}</p>
    </li>
{% else %}
    <li class="no-data">{{ noPostsMessage }}</li>
{% endfor %}
</ul>


{# Pagination #}
{% if posts.lastPage > 1 %}
    <ul class="pagination">
        {% if posts.currentPage > 1 %}
            <li><a href="{{ this.page.baseFileName|page({ (pageParam): (posts.currentPage-1) }) }}">&larr; Prev</a></li>
        {% endif %}

        {% for page in 1..posts.lastPage %}
            <li class="{{ posts.currentPage == page ? 'active' : null }}">
                <a href="{{ this.page.baseFileName|page({ (pageParam): page }) }}">{{ page }}</a>
            </li>
        {% endfor %}

        {% if posts.lastPage > posts.currentPage %}
            <li><a href="{{ this.page.baseFileName|page({ (pageParam): (posts.currentPage+1) }) }}">Next &rarr;</a></li>
        {% endif %}
    </ul>
{% endif %}

PHP

Category Filter

use RainLab\Blog\Models\Post as BlogPost;

function onStart(){
    //This is where you list the categories you want to display
    $categories = ['blog'];
    $posts = [];
    foreach(BlogPost::all() as $blog){
        foreach($blog->categories as $cat){
            if(in_array($cat->slug, $categories)) {
                array_push($posts, $blog);
                break;
            }
        }
    }
   $this['filteredPosts'] = $posts;
}

Hardik Satasiya Hardik Satasiya · Accepted Answer · 2018-06-06T12:57:14

It seems you are overriding postswith your custom data filteredPosts and your custom data is not respecting pagination

{% set posts = blogPosts.posts %} 
{% for post in posts %}

this is a loop which is iterate through all the posts in normal case it is looking like this

In your case its

{% for post in filteredPosts %}

you see posts comes from the plugin component itself but you are overriding it with your data filteredPosts

function onStart(){
    //This is where you list the categories you want to display
    $categories = ['blog'];
    $posts = [];
    foreach(BlogPost::all() as $blog){
        foreach($blog->categories as $cat){
            if(in_array($cat->slug, $categories)) {
                array_push($posts, $blog);
                break;
            }
        }
    }
   $this['filteredPosts'] = $posts;
}

And I don't see any pagination logic in your code so it just shows the post you have in filteredPosts as pagination is building perfect as it uses posts which is passed by component.

It seems your filter-logic is creating problem we can use built-in filter logic to avoid this.

Remove your logic code from the onStart and use a slug /blog/:page?/:slug?

Configuration

Component Default HTML / to reset it to default Just re-add component and use it or copy this code and use it

{% component 'blogPosts' %}

Now if we check URLs https://october-plaza.com/blog/:page?/:slug

https://october-plaza.com/blog/1 - page 1
https://october-plaza.com/blog/1 - page 2
https://october-plaza.com/blog/1/food - page 1 with category filter based on -slug food
https://october-plaza.com/blog/2/food - page 2 with category filter based on slug food

If you face any problem please comment

Blog Pagination not working

1 Answers