Basic

A basic pagination with active item

Seprated

Pagination with seprated Next and Previous icons

To create seprated pagination use .prev-item class for the first item and .next-item for the last item

With icon and text

Pagination with icon and text

Only icons

Pagination with only icons

Success

Use class .pagination-success with .pagination

Danger

Use class .pagination-danger with .pagination

Info

Use class .pagination-info with .pagination

Warning

Use class .pagination-warning with .pagination

Pagination Positions

use classes .justify-content-{direction} with .pagination to align your pagination

Left Aligned
Center Aligned
Right Aligned

Pagination Sizes

Use class .pagination-lg for large size pagination & use .pagination-sm for small size pagination. For Default size no classes required.

Pagination Sizes With Border

Dynamic Pagination

We are using jQuery Pagination plugin. This jQuery plugin simplifies the usage of Bootstrap Pagintion. It uses appropriate classes: .pagination, .active and .disabled.

Default Pagination

You are on page 1

Default Pagination with last & first

You are on page 1

Pagination drop you here after reload

Warning! Page will reload.
You are on page 1

Set Start Page Of Pagination

Your start Page 5