Cara Menggunakan WP_Query untuk Membuat Pagination di WordPress
Diterbitkan: 2021-08-31
Salah satu cara produktif untuk meningkatkan tampilan halaman situs web Anda memiliki rasio pentalan yang optimal adalah dengan menggunakan WP_Query untuk membuat pagination di WordPress.
Dalam tutorial ini, kami akan memandu Anda melalui panduan yang mudah diikuti untuk menambahkan loop WordPress kustom dengan pagination.
Apa itu WP_Query?
WP_Query adalah salah satu kelas terpenting di WordPress karena itulah yang memberi Anda akses ke catatan, posting, halaman, dan jenis posting khusus dalam database.
Sementara itu, pengembang tidak perlu menulis kueri SQL yang kompleks terhadap database untuk menerima informasi yang diperlukan tentang posting, halaman, atau jenis posting khusus, karena WP_Query akan melakukan semuanya untuk kita.
Apa itu pagination di WordPress dan mengapa Anda membutuhkannya?
Pagination adalah salah satu fitur inti yang dapat digunakan oleh setiap pengguna WordPress untuk berbagai tujuan. Ini adalah praktik yang baik untuk membagi posting panjang menjadi beberapa bagian dan menampilkan masing-masing dengan halaman baru.
Jika Anda menggunakan tema WordPress yang dikodekan dengan baik yang Anda inginkan, kemungkinan besar, menggunakan tag di posting Anda yang ditambahkan tepat di mana pun Anda membutuhkan posting untuk mengakhiri dan memulai pada halaman berikutnya akan melakukan pekerjaan untuk Anda.
Tidak sulit untuk menebak bahwa posting yang panjang akan memakan waktu lama untuk dimuat dan akan merepotkan pengunjung situs web atau pengikut blog untuk membaca.
Memisahkan artikel atau deskripsi panjang Anda ke dalam halaman sebanyak mungkin akan memudahkan pembaca untuk mencerna semua informasi tanpa merasa terganggu.
Jika Anda seorang webmaster WordPress atau pemilik situs web WordPress, kami yakin Anda tahu tentang fungsionalitas pagination bawaan WP yang dapat Anda gunakan dengan mudah dengan tautan atau pagination numerik untuk membagi posting panjang menjadi banyak bagian yang berbeda sesuai kebutuhan dan menampilkannya dengan halaman sebelumnya dan selanjutnya demikian.
Selain membuat artikel dan postingan Anda lebih mudah diikuti dan lebih mudah dibaca, pagination juga memiliki manfaat lain.
Ini akan membuat keseluruhan tampilan dan nuansa situs Anda lebih akurat dan ringkas, menambahkan tampilan halaman situs Anda, membantu mengurangi rasio pentalan, berkontribusi pada peringkat SEO dan memberi Anda lebih banyak halaman untuk menempatkan iklan dan banyak lagi.
Namun, metode ini tidak selalu bekerja dengan mudah dengan tema dan template WordPress kontemporer. Oleh karena itu, kami menawarkan Anda untuk menggunakan WP_Query untuk membuat pagination di WordPress.
Sebelum kita masuk lebih dalam ke proses yang merinci cara menggunakan WP_Query untuk membuat pagination di WordPress, kami sarankan Anda untuk membiasakan diri dengan referensi kelas WP Query di WordPress Codex: https://codex.wordpress.org/Class_Reference/WP_Query#Usage .
Sekarang, ketika Anda memiliki gambaran umum tentang WP_Query dan penggunaannya, izinkan kami membagikan contoh kueri dengan Anda.
<?php
/**
* Nama Template: Halaman Kustom
*/
get_header(); ?>
<?php
$paged = ( get_query_var( 'paged' ) ) ? get_query_var( 'paged' ): 1;
$args = array(
'posts_per_page' => 4,
'dihalaman' => $halaman
);
$custom_query = new WP_Query( $args );
?>
<!----mulai-------->
<div class="bungkus">
<div class="content-area">
<kelas utama="situs-utama" peran="utama">
<?php
while($custom_query->have_posts()) :
$custom_query->the_post();
?>
<div>
<ul>
<li>
<h3><a href="<?php the_permalink(); ?>" ><?php the_title(); ?></a></h3>
<div>
<ul>
<div><a href="<?php the_permalink(); ?>"><?php the_post_thumbnail('thumbnail'); ?></a></div>
</ul>
<ul>
<p><?php echo the_content(); ?></p>
</ul>
</div>
<div>
</li>
</ul>
</div> <!-- akhiri entri blog -->
<?php sementara; ?>
<?php if (function_exists("pagination")) {
pagination($custom_query->max_num_pages);
} ?>
</main><!-- #main -->
</div><!-- #utama -->
</div><!-- .wrap -->
<!----selesai-------->
<?php get_footer();
Cara menggunakan WP_Query untuk membuat pagination di WordPress
Kode untuk merender pagination
Buat file template bernama CustomPage.php di folder tema dan tambahkan potongan kode yang disebutkan di bawah ini di halaman statis kustom.
<?php if (function_exists("pagination")) {
pagination($custom_query->max_num_pages);
} ?>
Buka dasbor Admin untuk membuat halaman dan pilih halaman khusus sebagai template.
Selanjutnya, Anda perlu menggunakan kode berikut untuk membuat pagination kustom berfungsi: Anda perlu menambahkan kode ini di functions.php (dapat ditemukan di folder tema Anda).
fungsi pagination($pages = ”, $range = 4)
{
$showitems = ($kisaran * 2)+1;
halaman $ global;
if(empty($paged)) $paged = 1;
if($halaman == '')
{
global $wp_query;
$halaman = $wp_query->max_num_pages;
jika(!$halaman)
{
$halaman = 1;
}
}
jika(1 != $halaman)
{
echo "<div class=\"pagination\"><span>Halaman ".$paged." dari ".$pages."</span>";
if($paged > 2 && $paged > $range+1 && $showitems < $pages) echo “<a href='”.get_pagenum_link(1).”'>« Pertama</a>”;
if($paged > 1 && $showitems < $pages) echo “<a href='”.get_pagenum_link($paged – 1).”'>‹ Sebelumnya</a>”;
untuk ($i=1; $i <= $halaman; $i++)
{
if (1 != $pages &&( !($i >= $paged+$range+1 || $i <= $paged-$range-1) || $pages <= $showitems ) )
{
echo ($halaman == $i)? "<span class=\"current\">".$i."</span>":"<a href='".get_pagenum_link($i)."' class=\"tidak aktif\" >".$i."</a>";
}
}
if ($paged < $pages && $showitems < $pages) echo "<a href=\"".get_pagenum_link($paged + 1)."\">Berikutnya ›</a> "; if ($paged < $pages-1 && $paged+$range-1 < $pages && $showitems < $pages) echo "<a href='".get_pagenum_link($pages) ."'>Terakhir »</a>"; echo "</div>\n"; } }
Sekarang kita telah berhasil menggunakan WP_Query untuk membuat pagination di WordPress, mari kita lanjutkan ke bagian styling. Secara alami, sekarang kita harus berurusan dengan file style.css alih-alih function.php.
Temukan style.css di folder tema dan tambahkan kode di bawah ini.
/* Paginasi */
.paginasi {
jelas: keduanya;
posisi: relatif;
ukuran font:11px; /* Ukuran teks paginasi */
tinggi garis:13px;
mengapung:kanan; /* Arah float paginasi */
}
.pagination span, .pagination a {
tampilan: blok;
mengapung: kiri;
margin: 2px 2px 2px 0;
bantalan:6px 9px 5px 9px;
dekorasi teks: tidak ada;
lebar: otomatis;
warna:#ff; /* Warna teks paginasi */
latar belakang: #555; /* Penomoran warna background non-aktif */
-webkit-transisi: background .15s ease-in-out;
-moz-transition: background .15s ease-in-out;
-ms-transition: background .15s ease-in-out;
-o-transisi: background .15s ease-in-out;
transisi: background .15s ease-in-out;
}
.pagination a:hover{
warna:#ff;
latar belakang: #6AAC70; /* Latar belakang pagination saat melayang */
}
.pagination .current{
bantalan:6px 9px 5px 9px;
latar belakang: #6AAC70; /* Latar belakang halaman saat ini */
warna:#ff;
}
Itu dia. Kami sangat berharap artikel kami akan membantu Anda menggunakan WP_Query untuk membuat pagination di WordPress tanpa hambatan. Jika ada pertanyaan tentang tutorial ini atau kode yang dibagikan di dalamnya, jangan ragu untuk meminta bantuan kami!
Saat Anda menyiapkan situs web Anda di WordPress, salah satu hal yang mungkin ingin Anda pertimbangkan adalah menggunakan wp_query untuk membuat pagination di WordPress .
Tentu saja, Anda pasti bertanya-tanya mengapa Anda harus repot dengan pagination, tetapi inilah mengapa pagination merupakan aspek penting dari situs web mana pun.
Pagination adalah proses di mana Anda dapat membagi posting panjang menjadi posting yang lebih pendek dengan bagian dari posting asli yang diposting di halaman lain dengan link kembali ke posting asli.
Ini membantu meningkatkan tampilan halaman di situs web Anda dan terbukti sangat berharga dalam hal SEO dan peringkat.
Inilah sebabnya mengapa Anda perlu menggunakan wp_query untuk membuat pagination di WordPress sehingga Anda dapat menyesuaikan posting, membuatnya lebih pendek dan dalam prosesnya, membantu meningkatkan pengalaman pengguna. Berikut adalah beberapa alasan mengapa pagination penting dan mengapa penting untuk situs web Anda.
- Tampilan bersih dan tajam: Sebagai hasil dari pagination, Anda seharusnya dapat membuat postingan Anda lebih pendek dan dalam prosesnya, biarkan halaman depan Anda rapi. Ini akan memungkinkan Anda untuk menampilkan pelanggan Anda dengan tampilan yang bersih dan tajam.
Selain itu, dengan posting yang dipangkas lebih pendek, Anda harus dapat memanfaatkan sepenuhnya ruang putih secara strategis dan mengarahkan perhatian pengguna ke bagian yang relevan dari situs web Anda, mungkin ke ajakan bertindak sehingga mereka dapat mengklik yang sama.
- Pemasaran: Dengan pagination, Anda harus dapat memangkas panjang posting dan mengoptimalkannya juga dalam prosesnya.
Dengan plugin ini, Anda dapat memutuskan posting mana yang ingin dipangkas lebih pendek dan bahkan menyesuaikan posting, sehingga tampak lebih menarik bagi pengguna akhir.
Akibatnya, lalu lintas Anda akan meningkat dan dalam prosesnya, Anda juga harus dapat terlibat lebih banyak dengan pengguna Anda daripada sebelumnya.
- Keterlibatan pengguna: Tidak ada pengguna yang ingin membaca posting panjang tepat di halaman depan; itulah mengapa penting bagi Anda untuk menggunakan pagination agar postingan tetap pendek.
Pengguna akan menghargai tampilan yang rapi, halaman yang dimuat dengan cepat dan sebagai hasilnya, Anda harus dapat terlibat lebih banyak dengan mereka.
Dengan pagination yang ikut bermain, Anda harus dapat menjaga rasio pentalan pada tingkat optimal, membuat audiens Anda cukup tertarik dan yang lebih penting, meningkatkan tampilan halaman di situs web Anda.
Akibatnya, Anda terikat untuk meningkatkan peringkat Anda serta memberikan dorongan untuk tingkat konversi online Anda.
Ini adalah beberapa alasan mengapa Anda perlu memiliki pagination di situs web Anda karena dapat membantu kinerja situs web Anda lebih baik dari sebelumnya.
Anda dapat memutuskan seberapa pendek postingan yang Anda inginkan, dan dengan pagination, Anda harus dapat menentukan panjangnya, dan bahkan tampilan postingannya. Dengan fitur ini, Anda seharusnya dapat memberikan pengalaman pengguna yang lebih baik kepada pengguna Anda.