Create a custom pagintion for the Winter.Blog Plugin.
0
When using the Winter Blog plugin the component also creates you an example pagination with a left arrow together with the word "Last", then ALL PAGES followed by a right arrow and the word "Next".
The problem is that with many items, the pagination can become very big and depending on how you CSS it, it might break into a second row.
So instead of having a pagination like PREVIOUS 1 - 2 - 3 - 4 - 5 - 6 - 7 - 8 - 9 - 10 - 11 - 12 - 13 - 14 - 15 - 16 NEXT
The following code allows you to have something like this: PREVIOUS 5 - 6 - 7 - 8 - 9 NEXT
{% if posts.currentPage < posts.lastPage - 4 %}
{% for page in posts.currentPage..posts.currentPage + 4 %}
<a href="{{ this.page.baseFileName | page({ (blogPosts.pageParam): page }) }}" class="{{ posts.currentPage == page ? 'active' : null }} item">{{ page }}</a>
{% endfor %}
{% else %}
{% for page in posts.currentPage..posts.lastPage %}
<a href="{{ this.page.baseFileName | page({ (blogPosts.pageParam): page }) }}" class="{{ posts.currentPage == page ? 'active' : null }} item">{{ page }}</a>
{% endfor %}
{% endif %}
On the first and second line the number "4" defines how many items you want to be shown between the PREVIOUS and the NEXT button.
There are no comments yet
Be the first one to comment