Cara Membuat Read More pada Blogspot

Share/Bookmark

"Read more" ataupun "Baca selanjutnya" merupakan salah satu fungsi yang sering digunakan dalam penulisan sutau artikel pada blog. Fungsi tersebut digunakan untuk menyingkat sebuah artikel. Misalnya saja, ketika kita memiliki suatu artikel yang panjang dan akan menulisnya dalam blog, secara default blogspot menampilkan artikel tersebut secara keseluruhan. Bagaimana jika anda memiliki 5 buah artikel yang sangat panjang? Pastinya 5 arikel tersebut secara keseluruhan akan ditampilkan dan blog anda akan menjadi panjang ke bawah pastinya kutu buku. Nah, dengan adanya fungsi "Read more" ataupun "Baca selanjutnya", maka kita dapat memotong tulisan dalam sebuah artikel. Dalam artian, kita hanya menampilkan bagian atas dalam artikel tersebut. Sebagai contoh adalah dalam blog ini nyengir.

Ok, sekarang langsung saja kita mencoba membuat fungsi tersebut pada blogspot. Hal yang harus dilakukan adalah :
  • Login terlebih dahulu dengan menggunakan account blogspot anda.
  • Setelah selesai, langsung saja pilih Layout atau tata letak dan pilih tab Edit HTML.
  • Masukkan kode berikut sebelum tag atau tepat sesudah kode }]]></body>seperti dibawah ini:
<style>
<b:if cond='data:blog.pageType == "item"'>
span.fullpost {display:inline;}
<b:else/>
span.fullpost {display:none;}
</b:if>
</style>
  • Selanjutnya mengatur supaya postingan terpotong, cari kode <data:post.body/> dalam template anda. Jika tidak ditemukan, coba anda centang Expand Widget Templates dan tambahkan kode berikut tepat dibawahnya:
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'> Read More..</a>
</b:if>
  • Jika sudah, sekarang kita beralih ke halaman Setting -> Formating lalu pada bagian bawah (Post Template), Masukkan kode brikut ini:
<span class="fullpost">

</span>
Hal diatas digunakan agar setiap kita memulai posting, maka akan muncul kode diatas pada bagian Edit HTML di halaman posting. Nah, untuk menggunakan fungsi tersebut yaitu:
  • Ketika akan membuat posting baru, maka langsung pilih tab Edit HTML kemudian tuliskan artikel yang akan ditampilkan pada halaman depan sebelum kode berikut
<span class="fullpost">
  • Lalu artikel selanjutnya, masukkan diantara kode berikut.
<span class="fullpost">

</span>
Nah, selesai sudah kita membuat halaman "Read more..." atau "Selanjutnya...". Selamat mencoba.

Tulislah Komentar Anda


Komentar anda sangat berguna bagi kemajuan blog ini.

Post a Comment

Xinthinx Blog Tutorial © 2008 Template by Dicas Blogger, emoticon from Yahoo! and KASKUS.

TOPO