A Responsive pagination library can generate pagination like many others. But the main goal is to provide responsive functionality for hiding and showing some link buttons according to breakpoints.
Responsivity is fully controlled only by your own CSS classes, so can be used with Bootstrap, any other framework or custom solution.
It also can be used with any CMS. There is an example with Wordpress too.
Click to see full size
Live usage is available also on my blog kutac.cz/blog (in Czech language).
composer require arxeiss/responsive-pagination
Usage and examples
- Basic example with Bootstrap integration and searching
- Integration into Wordpress
- Live demo on my blog
range argument specifies how many button links around the actual page button are shown to each side.
But it is not the final amount of buttons, because first and last page buttons are not counted in as well as dots.
When the current page is first or last, the range is increased by 2. If the current page is second or second from the end, the range is increased by 1. The reason is simply to show more buttons when there is a space.
Range vs max visible items
There is a direct proportion between the
range argument and the maximum amount of visible buttons. The easy equation is
max buttons = range * 2 + 5.
If you pass range into constructor or addBreapoint method, you can calculate how many buttons will be maximally visible.
There is also a static method
rangeToMaxVisible which does the same calculation.
range * 2- there are
rangeamount of buttons to each side from the current page button
+1- the current page button
+2- the first and the last page button
+2- dots after the first and before the last page button