How to Start a Blog? Panduan Lengkap Membuat Blog Hanya 30 Menit

Menambahkan Nomor Halaman dengan WP-Pagenavi di WordPress

Tutorial kali ini akan membahas bagaimana menambahkan nomor halaman atau Page Number dalam tema WordPress. Menambahkan fitur nomor halaman pada situs WordPress Anda bertujuan untuk memudahkan para pembaca untuk menavigasi situs Anda ketika ingin melakukan pindah dari halaman Pertama menuju ke halaman kedua maupun langsung meloncat ke halaman yang mereka inginkan sekalipun.

Fitur nomor halaman ini biasanya pada tema tertentu sudah terpasang, namun masih banyak sekali template WordPress yang masih belum ada fitur page number dan yang ditampilkan adalah fitur bawaan bawaan seperti ‘Older Post dan Previous Post’.

Jika Anda saat ini memiliki situs WordPress dan tema Anda belum mendukung fitur page number, maka pada artikel kali ini saya akan memberikan cara termudah untuk Anda untuk menambahkan fitur page number di tema WordPress Anda dengan plugin WP-PageNavi.

WP Page Number PageNavi

Cara Membuat Page Number dengan WP-PageNavi

Untuk membuat Page number di WordPress, hal pertama yang perlu Anda lakukan adalah menginstal dan mengaktifkan plugin WP-PageNavi. Setelah mengaktifkan plugin, silahkan Anda pergi ke Setting »PageNavi untuk mengkonfigurasi pengaturan plugin.

Pada halaman pengaturan plugin ‘PageNavi Settings’ Anda dapat mengganti teks default dan pengaturan pagination numerik sesuai dengan yang anda inginkan pada kolom yang sudah disediakan.

page number plugins wp-pagenavi tutorial

Pada langkah berikutnya, Anda perlu menambahkan script tag php ke template tema WordPress Anda. Silahkan cari file index.php dan archive.php di folder template yang Anda gunakan . Tambahkan tag berikut ke tema Anda untuk menggantikan script previous_posts_link and next_posts_link.

Sebagai contoh dalam tema Twentytheme, kode yang perlu Anda ganti adalah sebagai berikut :

<div class="nav-previous"><?php next_posts_link( __( '<span class="meta-nav">&larr;</span> Older posts', 'twentyten' ) ); ?></div>

<div class="nav-next"><?php previous_posts_link( __( 'Newer posts <span class="meta-nav">&rarr;</span>', 'twentyten' ) ); ?></div>

Dan silahkan hapus kode seperti diatas dan ganti dengan kode dibawah ini.

<?php wp_pagenavi(); ?>

Selain itu, Anda juga dapat membuat tampilan nomor halaman sesuai dengan keinginan Anda dengan memanfaatkan pengaturan CSS kustom yang bisa Anda ubah. Caranya, Anda dapat menyalin file pagenavi-css.css dari direktori plugin ke direktori tema Anda dan melakukan modifikasi di sana. Dengan cara ini, Anda tidak akan kehilangan perubahan saat memperbarui atau melakukan update plugin.

Silahkan masuk pada menu Plugins » Editor » pilih drop down menu dan pilih ‘Wp-Pagenavi’  dan silahkan klik tombol ‘Select’. lakukan perubahan css sesuai dengan yang Anda inginkan di file ‘wp-pagenavi/pagenavi-css.css’.

page-navi css modifikasi

Atau, Anda dapat menghapus centang pada opsi “Use pagenavi.css?” Dari halaman pengaturan dan tambahkan style ke file style.css tema Anda secara langsung.

Dan itulah cara mudah untuk menambahkan fitur page number di tema WordPress Anda dengan plugin WP-PageNavi, semoga artikel ini bermanfaat buat Anda dan selamat mencoba. 🙂

 

Anda Terbantu artikel ini? Silahkan bergabung dengan centerklik di Twitter dan Google+.

Daftar isi Tutorial Wordpress Terlengkap Gratis
10 top hosting!

Register Now: TOP 10 Hosting

Dapatkan Hosting Murah dengan Kualitas Terbaik. For Serious Blogger! View Deals

Bluehost Hosting

$2.95/Month Free Domain, Unlimited Space & Bandwidth Get Host

iPage Hosting

$1.99/Month Free Domain, Unlimited Space & Bandwidth Get Host

SiteGround Hosting

$3.45/Month Free Domain, Unlimited Space & Bandwidth Get Host

WebHostingPad

$1.99/Month Free Domain, Unlimited Space & Bandwidth Get Host

Hostgator

$3.95/Month Free Domain, Unlimited Space & Bandwidth Get Host

5 Comments

Add a Comment

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

Must Read...!
Theme WordPress MinaLite Responsive Free

MinaLite adalah Theme WordPress responsive gratis yang memiliki desain sederhana namun elegan yang cocok...

Crello – Software Desain Grafis dan Editor Foto Online Gratis

Ketika Anda sedang melakukan bisnis internet seperti internet marketing, atau sedang menjalankan website atau...

Close