
Sistem Paginasi Halaman Selanjutnya (Next) & Sebelumnya (Prev) di PHP + Pembatasan Konten Perhalaman
Halaman 1, Halaman 2, dst.
Pada halaman yang menampilkan daftar misalnya daftar blog atau yang biasa disebut Feed biasanya memiliki halaman Selanjutnya (Next) dan Sebelumnya (Prev), dengan begitu tentu memerlukan tombol untuk mengarahkan ke halaman selanjutnya dan halaman sebelumnya. Tutorial kali ini akan menjelaskan cara membuat sistem tersebut termasuk cara membatasi jumlah blog / konten pada feed perhalaman menggunakan MySQLi Statement.
Perlu diperhatikan, sistem website yang dijelaskan disini menggunakan parameter misalnya ketika menampilkan home berupa index.php dan ketika menampilkan halaman blog menjadi index.php?blog.
Sistem Paginasi
Pertama, silahkan buka codingan PHP halaman feed nya (misalnya blog.php) yang menampilkan daftar artikel mulai dari yang terbaru sampai yang terdahulu. Misalnya halaman blog memiliki code seperti ini:
<?php $query = mysqli_query($koneksi, "SELECT * FROM post WHERE post.statuspost = '1' ORDER BY id DESC"); ?> <div class="container"> <div class="row"> <div class="posterbaruhome"> <?php if(mysqli_num_rows($query)) { ?> <?php while($row = mysqli_fetch_array($query)) {?> <div class="col-md-4"> <div class="panel panel-default"> <div class="panel-heading"> <h3 class="panel-title read-more"><a href="index.php?detail=<?php echo $row['id'] ?>"><?php echo $row['judul'] ?></a></h3> </div> <div class="panel-body" style="text-align: center; overflow: hidden; padding: 0;"> <img style="max-height: 200px; left: 0" src="images/blog/<?php echo $row['gambarpost'] ?>" class="img-responsive"> </div> <div class="panel-footer read-more"><a href="index.php?detail=<?php echo $row['id'] ?>">Baca Selengkapnya</a></div> </div> </div> <?php } ?> <?php } ?> </div> </div> </div>
Dengan code tersebut menampilkan semua data pada table database post secara keseluruhan dan berulang-ulang berupa daftar kebawah tanpa batas dan tanpa tombol paginasi / pagination. Belum tau cara menampilkan data ? Lihat cara menampilkan data di database disini (single) dan disini (multiple).
Selanjutnya silahkan tambahkan code berikut pada bagian atas file ($query):
Baca Juga:
$per_laman = 12; $laman_sekarang = 1; if(isset($_GET['laman'])) { $laman_sekarang = $_GET['laman']; $laman_sekarang = ($laman_sekarang > 1) ? $laman_sekarang : 1; } $total_data = mysqli_num_rows(mysqli_query($koneksi, "SELECT * FROM post ORDER BY id DESC")); $total_laman = ceil($total_data/$per_laman); $awal = ($laman_sekarang - 1) * $per_laman;
Terapkan diatas variable query tadi sebagai pemanggil datai untuk menampilkan data dihalaman blog ini.
$per_laman = 12; untuk menentukan berapa jumlah konten / pos yang ingin ditampilkan perhalaman, contohnya 12 konten halaman maka tulis 12. Pastikan data yang ada di table database post memiliki entri lebih dari jumlah perhalaman supaya bisa menjadi paginasi.
$laman_sekarang; merupakan variable untuk menentukan halaman blog ini merupakan halaman ke berapa ? Tentu halaman pertama.
if merupakan condition jika tombol next / prev ditekan maka akan mengarah ke halaman berikutnya / sebelumnya. GET[“laman”] disini diambil dari nama tombol pagianasi yang akan dibuat nanti dibawah.
$total_data merupakan variable untuk menyebutkan semua data yang ada didalam table database pos yang nantinya akan digunakan.
$total_laman merupakan variable untuk mejelaskan dan menentukan penjumlahan perhalaman dengan ceil supaya menjadi penghitungan dibulatkan. Misalnya data yang ada ditable database post ada 50 kemudian disini ditentukan perhalaman nya 12 (50 dibagi 12 sama dengan 4 koma sekian) maka dibulatkan keatas.
$awal merupakan variable penyebut halaman awal
Sekarang kita batasi dalam pemanggilan dan penampilan data di $query tadi, tambahkan LIMIT $per_laman OFFSET $awal
di akhirnya, maka sekarang codingan pada $query menjadi seperti ini: $query = mysqli_query($koneksi, "SELECT * FROM post WHERE post.statuspost = '1' ORDER BY id DESC LIMIT $per_laman OFFSET $awal");
yang memiliki batas penampilan menggunakan $perlaman OFFSET $awal yang diambil dari variable diatasnya.
Tombol Paginasi
Sekarang, buatlah tombol paginasi sesuai dengan desain dan tata letak yang diinginkan pada halaman (biasanya tombol paginasi diletakkan dibagian bawah halaman). Tambahkan code ini dibawah halaman setelah menampilkan daftar konten blog tadi:
<?php if(isset($total_laman)) { ?> <?php if($total_laman > 1) { ?> <nav class="text-center"> <ul class="pagination"> <?php if($laman_sekarang > 1) {?> <li> <a href="index.php?laman=<?php echo $laman_sekarang - 1 ?>" aria-label="Sebelumnya"> <span aria-hidden="true">Sebelumnya</span> </a> </li> <?php }else { ?> <li class="disabled"> <span aria-hidden="true">Sebelumnya</span> </li> <?php } ?> <?php if($laman_sekarang < $total_laman) {?> <li> <a href="index.php?laman=<?php echo $laman_sekarang + 1 ?>" aria-label="Selanjutnya"> <span aria-hidden="true">Selanjutnya</span> </a> </li> <?php }else {?> <li class="disabled"> <span aria-hidden="true">Selanjutnya</span> </li> <?php } ?> </ul> </nav> <?php } ?> <?php } ?>
Jangan terpaku dengan desain tombol ini, ini hanya contoh saja. Silahkan buat desain sesuai selera kalian, pastika sistemnya sama dengan diatas seperti kondisi if else. Save dan buktikan !
Sekarang, ketika membuka halaman blog akan menampilkan tombol paginasi selanjutnya dan sebelumnya . Ketika tidak ada konten lagi di halaman berikutnya atau halaman sebelumnya maka tombol akan disabled (tidak dapat di klik).
Masih bingung ? Lihat : Video tutorial cara membuat sistem halaman PHP.
Tutorial ini seperti tutorial-tutorial PHP di situs ini sebelumnya menggunakan MySQLi Statement, pastikan halaman yang kalian gunakan untuk menampilkan blog juga menggunakan MySQLi Statement karena kalo berbeda tentu tidak akan berfungsi dan harus menggunakan statement yang sama.
Selamat mencoba !