2010-11-22

Membuat Auto read more di Blogspot

Membuat Read More Otomatis Di Blogspot (Automatic Read More + Thumbnail Image)
Read more otomatis (Automatic Read more ) adalah read more atau baca selengkapnya dengan secara otomatis mengambil ringkasan dari blog kita di tambah lagi read more otomatis ini juga dapat menampilkan gambar dengan ukuran yang kita inginkan selain itu kita dapat menentukan jumlah  karakter yang akan kita tampilkan. 
Berikut caranya : 
1. Login di Blogger > pada Dasboard pilih Layout > Edit HTML
2. Centang / Check List dulu "expand widget templates"
3. Cari kode </head> kemudian copy - paste kode di bawah ini sebelum kode tersebut
<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://u-sup.googlecode.com/files/summarypost.js' type='text/javascript'/>
4. Sekarang cari kode<data:post.body/> dan ganti kode tersebut dengan kode dibawah ini
<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");
</script> <span class='rmlink' style='float:right;padding-top:20px;'><a expr:href='data:post.url'> Read More </a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>
5. Klik "simpan template"

Keterangan :
summary_noimg = 430; Menentukan jumlah ringkasan tanpa gambar
summary_img = 340; Menentukan umlah ringkasan dengan gambar
img_thumb_height = 100; kode ini untuk tinggi gambar thumbnailnya
img_thumb_width = 120; kode ini untuk lebar gambar thumbnailnya
Bagaimana jika telah menggunakan readmore verssi lama?
Jika kamu sebelumnya telah menggunakan readmore versi lama silahkan kembalikan dulu kodenya caranya perhatikan kode dibawah ini, ini kode readmore versi lama:

   
<div class='post-header-line-1'/>

    <div class='post-body entry-conten'>

    <b:if cond='data:blog.pageType == "item"'>

    <style>.fullpost{display:inline;}</style>

    <p><data:post.body/></p>

    <b:else/>

    <style>.fullpost{display:none;}</style>
    <p><data:post.body/></p>

    <a expr:href='data:post.url'>Read More......</a>

    </b:if>


Hapuslah kode yang dicetak tebal kemudian simpan template.

Dapatkan artikel terbaru seperti Membuat Auto read more di Blogspot langsung ke Email kamu..!!!