Membuat Navigasi Nomor Halaman WordPress

Posted in Wordpress, Tuesday, October 22nd, 2013, by Muhammad Fahmi Al Azhar

Jika Anda perhatikan, beberapa website memiliki nomor halaman yang menunjukkan banyaknya pembagian halaman pada blog tersebut. Contoh lain dapat Anda lihat juga pada hasil pencarian Google yang pada bagian bawah selalu menampilkan nomor hasil pencarian.

Nomor halaman atau yang disebut dengan paging navigation membuat tampilan website semakin enak dilihat. Dari nomor halaman tersebut pembaca secara tidak langsung mengetahui banyak tidaknya artikel di dalam website tersebut. Selain itu, pembaca juga dapat dengan mudah berpindah dari satu halaman ke halaman lain dengan mengeklik nomor halaman yang diinginkan.

Melanjutkan tutorial yang berkaitan dengan WordPress, post ini akan membahas bagaimana cara membuat paging navigation atau navigasi nomor halaman. Jika Anda tertarik dengan tutorial WordPress yang saya tulis, Anda dapat membaca indeks nya di tutorial membuat website WordPress.

Membuat Navigasi Nomor Halaman WordPress

Dalam website ini, dapat Anda lihat bahwa saya menggunakan paging navigation berupa penomoran halaman. Biasanya, pada theme-theme WordPress tertentu, navigasi selalu berbentuk older post dan newer post. Nah, pada tutorial ini kita akan membuat navigasi berbentuk nomor dengan menggunakan plugin yang telah tersedia.

membuat navigasi nomor halaman wordpress

Paging Navigation

Plugin yang kita gunakan untuk membuat paging navigation adalah WP-PageNavi. Plugin tersebut bisa di download  di http://wordpress.org/plugins/wp-pagenavi/ atau di search saja melalui fasilitas plugin yang ada di dashboard website WordPress Anda.

Setelah plugin diinstall, ada beberapa hal yang harus Anda lakukan agar navigasi nomor halaman dapat muncul di home website Anda. Pada intinya, Anda harus menyisipkan source code yang memanggil WP-PageNavi sehingga navigasi dapat muncul. Berikut ini adalah langkah-langkahnya:

Masuk ke halaman dashboard WordPress Anda.

Masuk ke menu Appearance >> Editor dan klik pada file index.php (pada barisan link di bagian kanan editor). Kadangkala tidak berada pada index.php, tergantung theme yang Anda gunakan. Setelah itu tambahkan potongan code berikut di tempat yang sesuai.

<?php if(function_exists('wp_pagenavi')) { wp_pagenavi(); } ?>

Yang dimaksud tempat sesuai adalah pada baris setelah code yang memunculkan deretan post pada website. Biasanya terletak pada code berikut ini:

<?php if ( have_posts() ) : ?>
<?php /*beberapa baris kode, tambahkan setelah kode ini selesai */ ?>

<?php if(function_exists('wp_pagenavi')) { wp_pagenavi(); } ?>

<?php else : ?>

Jika terdapat navigasi seperti older post, silakan di hapus agar tidak ikut muncul. Setelah itu, silakan simpan dengan klik tombol update file, kemudian cek website Anda, seharusnya telah muncul nomor navigasi.

Mengatur CSS WP-PageNavi

Untuk pengaturan CSS, Anda harus masuk ke dashboard Anda (wp-admin). Setelah itu masuk ke menu Plugins >> Installed Plugins dan carilah plugin WP-PageNavi, silakan klik edit. Pada barisan file di sebelah kanan carilah file pagenavi-css.css dan masukkan CSS yang sesuai dengan theme Anda.

Mengatur Setting PageNavi

Terakhir, untuk mengatur setting dari plugins tersebut, anda dapat masuk ke menu Settings >> PageNavi. Tentunya setelah Anda masuk ke halaman wp-admin milik Anda.

Sekian tutorial menambahkan paging navigation di WordPress. Semoga bermanfaat

Leave a Reply

Your email address will not be published. Required fields are marked *