Bootstrap Pagination

Fungsi pagination atau pagging

Fungsi dari Pagination adalah untuk menampilkan data yang banyak dibagi menjadi beberapa bagian, dan agar proses load suatu halaman website menjadi jauh lebih ringan pada saat diakses, tidak men-scroll terlalu jauh atau menghemat tampilan layar dan tentu saja bisa membuat tampil website menjadi lebih menarik.

Cara membuat bootstrap pagination

Dengan adanya Bootstrap desain page di website menjadi lebih mudah, kita hanya mengikuti aturan yang telah dibuat oleh Bootstrap. Simak bagaimana cara membuat page menggunakan Bootstrap.

Bootstrap sudah menyediakan class – class untuk pembuatan pagination :

1. class .pagination adalah sebagai langkah awal pembuatan pagination, biasanya class ini diletakkan didalam tag <ul>.
   Contoh : <ul class=”pagination”> … </ul>.
2. Class .disabled digunakan untuk menon-aktifkan sebuah page pagination, dan sedangkan class .active digunakan untuk menunjukkan page mana yang sedang dibuka atau diakses.
   Contoh : <ul class=”pagination”> <li class=”disabled”> <a href=”#”> &laquo; </a> <li class=”active”> <a href=”#”> &raquo; </a> </li> </ul>.
3. Sizing digunakan untuk ukuran pagination, class yang digunakan adalah .pagination-lg yang digunakan untuk ukuran pagination menjadi lebih besar sedangkan .pagination-sm membuat ukuran pagination menjadi kecil.
   Contoh : <ul class=”pagination pagination-lg”> … </ul>. <ul class=”pagination pagination-sm”> … </ul>.

berikut ini contoh bootstrap pagination :

See the Pen Bootstrap Pagination by yoris (@yoris) on CodePen.