Root » Tutorial » Cara Menambahkan Navigasi Link Tulisan

Cara Menambahkan Navigasi Link Tulisan

Tutorial ini ditulis pada October 2012

Mungkin saat ini Tutorial "Cara Menambahkan Navigasi Link Tulisan" sedikit berubah atau tidak berlaku lagi, Silahkan disesuaikan. Terima Kasih

Mempunyai navigasi link yang baik di blog merupakan hal yang penting untuk diketahui dan diterapkan. Salah satu caranya dengan menempatkan link ke tulisan sebelum dan tulisan selanjutnya pada bagian akhir tulisan.

Navigasi Link Tulisan Sebelum dan Selanjutnya

Navigasi Link Tulisan Sebelum dan Selanjutnya

Navigasi seperti ini akan memberikan peluang tulisan yang lainnya akan dilihat oleh pengunjung dan otomatis menambah internal link yang juga baik untuk mesin pencari.

Sebagian theme WordPress termasuk theme bawaan WP sudah menyertakan navigasi ini (Prev-Next), untuk theme yang belum mempunyai navigasi link ke tulisan sebelum dan berikutnya, bisa menambahkan kode berikut di single.php

<div id="prev-next">
<div class="prev-link">&laquo; Tulisan Sebelumnya <br />
<?php previous_post_link('%link', '%title'); ?>
</div>
<div class="next-link">Tulisan Selanjutnya &raquo; <br />
<?php next_post_link('%link', '%title'); ?>
</div>
</div>

Untuk penempatannya bisa sesudah tag < ?php the_content(); ?> atau sesuai keinginan seperti dibawah tulisan terkait seperti blog ini.

Untuk mengatur navigasi lebih lanjut, tambahkan juga kode CSS berikut di style.css

#prev-next {float: left;width:100%;}
#prev-next .prev-link {float: left;width:50%;text-align: left;}
#prev-next .next-link {float: right;width:50%;text-align: right;}
#prev-next a:{text-decoration: none; }
#prev-next a:hover { text-decoration: underline; }

Tambahan :

Untuk membuat navigasi link tulisan sebelum dan selanjutnya hanya untuk kategori yang sama, cukup ubah kode menjadi

<div id="prev-next">
 <div class="prev-link">&laquo; Tulisan Sebelumnya <br />
 <?php previous_post_link('%link', '%title', TRUE); ?>
 </div>
 <div class="next-link">Tulisan Selanjutnya &raquo; <br />
 <?php next_post_link('%link', '%title', TRUE); ?>
 </div>
 </div>

Dan jika tidak ingin memasukkan suatu kategori, misal kategori ber-ID 6 maka ubah menjadi

<div id="prev-next">
 <div class="prev-link">&laquo; Tulisan Sebelumnya <br />
 <?php previous_post_link('%link', '%title', FALSE, '6'); ?>
 </div>
 <div class="next-link">Tulisan Selanjutnya &raquo; <br />
 <?php next_post_link('%link', '%title', FALSE, '6'); ?>
 </div>
 </div>

Yap, sekarang dengan adanya navigasi link tulisan sebelum dan selanjutnya, tentu akan memberikan kemudahan bagi pengunjung blog.

Twitter

JhezeR

Engineer | Blogger | Pencari Ilmu | Internet Maniak | Pemburu Kesuk$e$an | Penikmat Musik, Film & Pertandingan | Interisti | Muser

telah mempunyai 236 Tulisan di JhezeR.com

Tutorial » WordPress » » » is gd Β»
Cara Menambahkan Navigasi Link Tulisan Reviewed by JhezeR on . Sebuah Tulisan tentang Cara Menambahkan Navigasi Link Tulisan @JhezeR.com

Mempunyai navigasi link yang baik di blog merupakan hal yang penting untuk diketahui dan diterapkan. Salah satu caranya dengan menempatkan link ke tulisan sebelum dan tulisan selanjutnya pada bagian akhir tulisan. Navigasi seperti ini akan memberikan peluang tulisan yang lainnya akan dilihat oleh pengunjung dan otomatis menambah internal link yang juga baik untuk mesin pencari.

Rating: 5

9 Komentar "Cara Menambahkan Navigasi Link Tulisan"


  1. html1155 | 57 Komentar + ♥♥♥
    October 22nd, 2012 @ 08:40

    siap untuk dipraktekkan…
    tapi blog saya yg satunya lagi kena suspend euy…

    Balas Yoo

  2. Hybrid car | 16 Komentar +
    October 22nd, 2012 @ 10:54

    Weh, mantab nih bos tips-nya. Ijin Bookmark ya… πŸ™‚

    Balas Yoo

  3. Muflich Kamil | 32 Komentar + ♥♥
    October 22nd, 2012 @ 14:37

    Keren mas.. cuman dah saya coba tapi gak rapih 😳

    Eiya mas.. barusan saya kirim email, mohon dicek.. penting soalnya πŸ™‚

    Balas Yoo

  4. Darin | 18 Komentar +
    October 22nd, 2012 @ 17:11

    Iya juga ya, kadang pembaca ga tau mana tulisan yang sebelum dan mana yang sesudah πŸ˜€
    Nanti2 saya coba deh mas Jhezer

    Balas Yoo

  5. Jefry | 4 Komentar +
    October 24th, 2012 @ 12:54

    Sepertinya saya belum memasang di blog wp saya
    terima kasih, Insya Allah akan saya tambahkan navigasi link posting ini..

    Balas Yoo

  6. ikhsan.net | 4 Komentar +
    October 24th, 2012 @ 15:17

    keren nih, tapi sayang saya gk make wp

    Balas Yoo

  7. Dwi Wahyudi | 1 Komentar +
    October 27th, 2012 @ 15:14

    Wah, main coding nih… πŸ™‚

    Balas Yoo

  8. kommotor.com | 1 Komentar +
    November 1st, 2012 @ 09:53

    Makasih mazbro..udah praktek…berhasil…

    Balas Yoo

  9. Tutorial Hijab | 3 Komentar +
    June 23rd, 2016 @ 05:07

    itu bukannya sdh ada otomatis ya

    Balas Yoo

Halo, Silahkan Tinggalkan Jejak Komentarnya Yoo...