Cara Membuat "Read More" di Blogspot

Bawaan standar dari template-template blogger a.k.a blogspot biasanya langsung mempostingkan lengkap postingan kita, hal ini mengakibatkan halaman blog kita akan terasa panjang sekali ke bawah. Nah, untuk mempercantik dan meminimalis panjangnya blog kita, kita dapat menggunakan "Read more". Hmm, gimana caranya? Yuk kita cekidot.. :D

1. Buka halaman blog kamu, lalu pilih bagian Template dan Edit HTML.


2. Di bagian Edit HTML, jangan lupa untuk memberi tanda centang pada Expand Template Widget.





3. Carilah kode </head> pada coding yang ada dengan cara menekan tombol CTRL+F pada keyboard lalu ketikkan </head> pada kolom find.

4. Copykan kode berikut tepat diatas kode </head>
<script type='text/javascript'> var thumbnail_mode = "no-float" ; summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 120; </script> <script src='http://rizqi.moehamed.googlepages.com/read-moreotomatis.js' type='text/javascript'/>
 Perhatikan keterangan berikut :
summary_noimg = 430; adalah tinggi potongan artikel tanpa gambar    
summary_img = 340; adalah tinggi potongan artikel dengan gambar  
img_thumb_height = 100; adalah ukuran tinggi thumbnail
img_thumb_width = 120; adalah ukuran lebar thumbnail

sobat bisa mengubah-ubahnya sesuai keinginan sobat,.

5. Cari lagi kode <data:post.body/> lalu ganti dengan kode script berikut :
<b:if cond='data:blog.pageType != &quot;item&quot;'> <div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div><script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script><span class='rmlink' style='float:right;padding-top:20px;'><a expr:href='data:post.url'>&#187;&#187;&#160;&#160;READMORE...</a></span> </b:if><b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>
 kata READMORE bisa sobat ganti dengan kata-kata yang sobat suka, misal, "Mau tau lebih lanjut..." atau "Baca kelanjutannya..." :D

6. Jika sudah terpasang dengan benar, simpan template yang udah dibuat lalu cobalah lihat hasilnya.
sebelum diberi READMORE


setelah diberi READMORE

Ok, sobat, selamat mencoba... :D

2 Komentar

Give me your comment, please...