Posted on

Tutorial memasang WP-PageNavi & WP PageNumbers

Navigation default pada wordpress biasanya menggunakan Older Entries dan Newer Entries.Dengan plugin wp-pagenavi dan wp pagenumbers,anda boleh menukar default navigation tersebut kepada number paging.

Sebelum memasang plugin :

sebelum

Selepas memasang plugin :

a)menggunakan wp-pagenavi

selepas1

b)menggunakan wp-pagenumbers

selepas2

Kelebihan memasang plugin :

1.Memudahkan navigasi dalam blog anda.

2.Menggalakkan pengunjung membaca entri-entri terdahulu.

3.Bagus untuk SEO.

Amaran :

 

Pastikan anda membackup template anda terlebih dahulu sebelum mencuba tutorial ini.Kami tidak bertanggungjawab terhadap sebarang kerosakan template anda.

 

Cara memasang :

a)Wp-PageNavi

1.Download plugin Wp-PageNavi disini :

http://wordpress.org/extend/plugins/wp-pagenavi/

2.Upload plugin ke folder wp-content/plugins dan extract.

3.Login ke wordpress control panel dan Activekan plugin wp-pagenavi.

4.Pergi ke Design->Theme Editor dan pilih themes yang anda sedang gunakan.

design

5.Klik pada Main Index Template (index.php) pada Templates section disebelah kanan anda.

index

6.Sila cari code seperti gambar dibawah dalam index.php anda.Code ini selalunya terletak dibahagian bawah.(Code ini mungkin sedikit berbeza bergantung kepada themes yang anda gunakan)

code

7.Gantikan code yang dihighlight dengan code ini :

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

8.Contoh code yang telah diubah :

index2

9.Klik Update File dan refresh blog anda untuk tengok hasilnya.

10.Anda boleh mengubah setting wp-pagenavi di bahagian Settings.

11.Hasil akhir :

selepas1

b)Wp Page Numbers

1.Download plugin Wp Page Numbers disini :

http://wordpress.org/extend/plugins/wp-page-numbers/

2.Upload plugin ke folder wp-content/plugins dan extract.

3.Login ke wordpress control panel dan Activekan plugin Wp Page Numbers.

4.Pergi ke Design->Theme Editor dan pilih themes yang anda sedang gunakan.

design

5.Klik pada Main Index Template (index.php) pada Templates section disebelah kanan anda.

index

6.Sila cari code seperti gambar dibawah dalam index.php anda.Code ini selalunya terletak dibahagian bawah.(Code ini mungkin sedikit berbeza bergantung kepada themes yang anda gunakan)

code

7.Gantikan code yang dihighlight dengan code ini

   1: <?php if(function_exists('wp_page_numbers')) { wp_page_numbers(); } ?>

8.Contoh code yang telah diubah :

index3

9.Klik Update File dan refresh blog anda untuk tengok hasilnya.

10.Anda boleh mengubah setting WP Page Numbers di bahagian Settings.

11.Hasil akhir :

selepas2

Kesimpulan :

Jika ditanya plugin mana yang lebih baik atau bagus,saya lebih prefer plugin wp page numbers kerana ianya lebih cantik,banyak themes untuk dipilih dan senang untuk dicustomize.

Plugin wp-page navi pula memerlukan anda edit css untuk menukar style nya.

Akhir kata selemat mencuba 🙂


RELATED POSTS

40 thoughts on “Tutorial memasang WP-PageNavi & WP PageNumbers

  1. kalau anda yang confuse,silalah tanya ye 🙂

  2. boleh try nih. thanks!

    shaxx´s last blog post..myLot Pays

  3. sama2 🙂
    tlg sampaikan kat rakan bloggers yg lain 😀

  4. huhu… cantek cantek 😉 tp nk tanya gak. apa beza pagenavi dgn pagenumbers? cuma lain plugin dan pembuatnya atau ada keistimewaan masing2?

    zariel´s last blog post..Dragon Ball Versi Hollywood

  5. pagenumbers lebih cun,byk themes.kalau page-navi kena edit manual css.
    so kalau aku,aku prefer pagenumbers (Y)

  6. aku nk ejas css bagi transparent mcm NoktahHitam camna? hehe

    zariel´s last blog post..Dragon Ball Versi Hollywood

  7. erk..ko kena tanya noktahhitam la kot 😀

  8. thank you for this. (Y)

  9. Alhamdulillah..rupanya plugin..
    jenuh ana cari..ingatkan theme..

    thanks bro..tambah tutorial byk lagi..
    aku bookmark blog ko kat YM aku (H)

  10. lupa lak..ada YM tak add aku
    puteraebiz

  11. sama2 Putera (H)
    ok aku dah add ym ko 🙂

  12. mcm bes ni..kena try (Y)

  13. Trimas tuk tutorial ni. Memang memudahkan bagi mereka2 yg nk cepat navigate terus ke sesuatu page.

  14. Sama2 😀
    aku buat tutorial ni sbb dari blogger lagi aku mengidam nak guna plugin nih 😛

  15. ok ini pun dah set kan thanks bro

  16. maaf nak tanya. mcamana nk buat langkah 2 tu.. tak retilah.. baru belajar wordpress ni. boleh email tak? tkasih

    1. tumpang tanya, pakai wordpress versi apa? 2.7 or 2.6.x? guna hosting yang ada cpanel/directadmin tak?

      EiNS´s last blog post..Bila…Aku Sudah Tiada

  17. mmmm.. good tutorial..

    boleh tukar themes dari admin panel…(overide)..

    atau boleh wat theme sendiri tuk navigation, upload themes dalam directory plugin/wp-pagenumber/themes … dan switch kat admn panel…

    good2..

    TQ for the tutorial…

    manS´s last blog post..yang di atas

  18. […] Tutorial lengkap boleh refer tutorial cyberfly di sini. […]

  19. salam. nk tmbah sket. bukan kat index sahaja. tapi kalau boleh letak kt archieve, search result. huhu, categori lg

  20. salam.mmg betul tu.aku pn lupa nak state masa tulis aritu.thanks :happy: :happy:

  21. hoho…rupanya kena edit main index templete….patut pun page bar tu x kuar2….haha
    neway, ada problm sikit…aku punya main index templete xde tu….mcm mana nak atur ekk…nak tambah kat bwh sekali code tu ke….hehe, baru lg dgn wp, so takut sikit nak edit…haha…harap blh beri tunjuk ajar :blush:

    1. Kod2 tak semestinya sama, tapi kalau ada yg bunyi2 navigation kat dalam index.php tu boleh la ganti…

    2. tambah je kat mana2 :biggrin:
      sbb nanti ko try refresh, bleh agak kedudukan nak letak kat mana code tu :blush:

      1. hoho…dah berjaya pasang…thanks :cheerful:
        p/s: lawa je part komen kita 3 ni…sume gravatar kartun… 😆

        1. Haha…sume peminat anime…rave, one piece n dragon quest 😀

  22. Ien..ngape kak jie nyer…dia tak mcm mendatar..dia menegak..
    .-= Kujie´s last blog ..Reasons to be grateful =-.

  23. nape den punyer xjadi pun :dizzy: :ermm:
    .-= hoyeea´s last blog ..Istilah Komputer =-.

    1. tak jadi camnetu?detail skit boleh?

  24. tenkiu utk tutorial ni.

    aku dah cuba. jadi tu memang jadi.
    tapi, bila dekat home..page navi tu tak de.
    bila klik ‘older entries’..baru ada.

    kenapa ek?

    1. Paste code tu dalam index.php, single.php, dll…gantikan kod older entries dengan kod wp page navi…
      .-= EiNS´s last blog ..Salam Ramadhan dan selamat berpuasa! =-.

      1. owh.
        okey, tenkiu! 😆

  25. terima kasih for the tutorial…
    baru buat di blog n its work.. :happy:

  26. ada rupanya tuto kat sini..aku main godek2..nasib baik jadi akhirnya..hehe :biggrin:
    .-= aizuddin´s last blog ..Apa Rafidah Ibrahim Ajar Aku Blogging? =-.

  27. Finally, blog aku ada juga paganavi nie. Thanks for the info dude.

  28. ini neh yg paling mantap, padat dan jelas. tengkyu masbro

  29. wow mantabs mas berhasil ane..
    terima kasih..

Tinggalkan komen anda