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.

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 !


Jangan Lupa Share !!!

58
9 shares, 58 points

Apa Reaksimu ?

Bingung Bingung
11
Bingung
Kesal Kesal
8
Kesal
OMG OMG
10
OMG
Takut Takut
9
Takut
Keren Keren
8
Keren
Sedih Sedih
2
Sedih
Posciety Tech

Pro

Official Channel Posciety.Com yang menyuguhkan informasi dan updates seputar dunia teknologi.

0 Komentar

Pilih Format
Artikel
Default, Membuat Artikel/Cerita
List
Listicle, Misalnya: 3 Hal yang Wajib Dilakukan Saat...
Kuis Kepribadian
Membuat kuis Tentang Kepribadian
Poll
Vote untuk Membuat Keputusan atau Mencari Saran
Meme
Membuat Meme dari Gambar Normal yang Kamu Miliki