Cara membuat read more bergambar otomatis di blog

Selamat datang di blog sederhana Temukan Cara, pada artikel kemarin saya telah berbagi ilmu tentang bagaimana cara membuat kotak komentar buka tutup di blog dan kali ini saya akan berbagi ilmu dengan anda yaitu tentang cara membuat read more otomatis di blog. Mungkin read more bergambar sudah diterapkan pada template-template anda, akan tetapi jika template dasarnya adalah dari blogger sendiri, mungkin anda hanya dapat menambahkannya secara manual. Sudahkah anda mengetahui bagaimana caranya...? Jika belum tau simak baik-baik cara membuat read more bergambar di bawah ini:

1.) Silahkan anda masuk ke akun blogger anda
2.) Selanjutnya anda masuk ke Template > Edit Html > Lanjutkan
3.) Setelah itu anda Backup dulu template anda, dan klik download template lengkap
4.) Jangan lupa centang tanda Expand Widget Template
5.) Cari kode </head> caranya yaitu Tekan Ctrl dan F, lalu cari kode </head>
6.) Setelah kode </head> ketemu, masukkan kode dibawah ini tepat dibawah kode </head>
Kode
<script type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ;summary_noimg = 450summary_img = 360img_thumb_height = 110; img_thumb_width = 130; </script> <script src='http://rizqi.moehamed.googlepages.com/read-moreotomatis.js' type='text/javascript'/>
7.) Kemudian setelah itu carilah kode <data:post.body/> 
8.) Jika anda menemukan 2 kode <data:post.body/>, pilih kode <data:post.body/> yang pertama
9.) Kemudian anda ganti kode <data:post.body/>  dengan kode dibawah ini 
Kode
<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="Baca Selengkapnya" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwzFnscufGg3Sm1oRuR5ob1YyKvXN5pVsQeX4oWGUOk1PcFLNGYBPxO5GNlhKcIa7IxL0B8XZH3d3yBbnR5kD58jBgLyO9t3mZ4_hdLqIE8MTB2wsY8gzcXLcOJoX-dVElG3w18kSG_Ww/s1600/ReadMore.jpg"/></a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>
10.) Ubahlah: https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwzFnscufGg3Sm1oRuR5ob1YyKvXN5pVsQeX4oWGUOk1PcFLNGYBPxO5GNlhKcIa7IxL0B8XZH3d3yBbnR5kD58jBgLyO9t3mZ4_hdLqIE8MTB2wsY8gzcXLcOJoX-dVElG3w18kSG_Ww/s1600/ReadMore.jpg dengan url gambar read more sesuai dengan yang anda sukai
11.) Yang terakhir jangan lupa simpan Template dan lihat hasilnya
Demikain yang bisa saya sampaikan pada postingan kali ini tentang cara membuat read more bergambar otomatis di blog, dan jika ada cara yang lebih praktis bisa berkomentar dibawah ini. Semoga apa yang saya sampaikan diatas dapat bermanfaat khususnya bagi blogger pemula.

Komentar