Cara Memasang Readmore Otomatis Dengan Gambar Pada Blog

Cara Membuat Readmore Otomatis Pada Blog Dengan Teks pernah saya bagikan di blog sebelum nya dan kali ini masih tutorial yang sama yaitu Cara Memasang Readmore Otomatis Dengan Gambar Pada Blog yaitu dengan langkah-langkah sebagai berikut :

1. Login dulu ke Blogger
2. Pilih Template
3. Klik Edit HTML
4. Centang dulu Expand Widget Template .
5. Cari kode </head> gunakan control F untuk memudahkan pencarian kode </head> pada template.
6. Lalu hapus kode </head> dan ganti dengan kode di bawah ini

</head><script type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 120; </script> <script src='http://blograngga.googlecode.com/files/read-moreotomatis.js' type='text/javascript'/>

7. Selanjut nya cari kode <data:post.body/> atau <p><data:post.body/></p>ganti kode tersebut dengan kode di bawah ini

<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'><img alt='Read More..' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWeNtH44fvrrFjlDehGiKYpmt_NtgkIMABhgxxn-_c5IiS4xL_dIfox0IfQ_8AdygSqlmx9ucbXuMVYQBhtxfFHQ4Y-arX4dyT_MoovXUgnbT16UZ08ngrbtCOqKNO5DzSJQ-eEBGAPvrv/s1600/blog+rangga+readmore.png'/></a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>

8. Terakhir Save Template untuk melihat hasil nya