Pada tutorial PHP sebelumnya pernah membahas sedikit mengenai pager, tombol Selanjutnya dan Sebelumnya. Kali ini kita akan membahas pagernya secara individu menggunakan framework Bootstrap.
Pager merupakan tombol Selanjutnya dan Sebelumnya yang disisipkan link untuk mengarah ke halaman lain, umumnya digunakan pada blog untuk memberikan petunjuk kepada para pembaca bahwa setelah dan sebelum pos yang saat ini dibaca masih ada pos-pos lainnya.
Dasarnya, membuat pager di Bootstrap cukup gunakan kodingan berikut:
<ul class="pager"> <li><a href="#">Previous</a></li> <li><a href="#">Next</a></li> </ul>
Manfaatkan class pager sebagai pembungkus, lalu masukkan ul dan li di dalamnya. Sisipkan link pada tag a sesuai tujuan yang ingin dituju. Defaultnya, tombol Selanjutnya dan Sebelumnya akan tampil di tengah-tengah halaman secara vertical.
Baca Juga:
Beberapa situs yang dibangun menggunakan Bootstrap juga menampilkan tombol Selanjutnya dan Sebelumnya disamping kiri dan samping kanan (jadi berjauhan), cukup gunakan kode di bawah ini jika ingin menampilkan pager berjauhan:
<ul class="pager"> <li class="previous"><a href="#">Sebelumnya</a></li> <li class="next"><a href="#">Selanjutnya</a></li> </ul>
Terlihat sekali bedanya, cukup tambahkan class previous dan class next agar posisinya berada di samping kiri dan samping kanan.
Simpan dan lihat hasilnya !