Membuat Auto Readmore Dengan Gambar Tanpa Java Script

Cara Membuat Auto Readmore Dengan Gambar Tanpa Java Script Untuk Blogger.

*Apa sih perbedaan menggunakan javascipt dengan tanpa javascript? Auto readmore dengan javascipt memakan waktu loading yang lebih lama lagi ketimbang tanpa java script. Nah, 1 lagi, katanya javascript membuat duplikat kontent yang akan membuat masalah lebih banyak lagi yang akan diberitahukan di Google Web Master.

Langkah Membuat Auto Readmore Dengan Gambar Tanpa Java Script :

1. Buka akun Blogger Anda
2. Masuk ke menu edit HTML,
3. Cari kode dibawah ini : (cari dengan Ctrl + F). 

<data:post.body/>

*Catatan : Biasanya kode diatas ada 3 sampai 4 pada template blogger.

 silahkan Anda gantikan kode dibawah ini pada seluruh kode yang ditemukan.

Cari dulu baru paste, Saran saya lebih baik anda ganti dari bawah. Jangan sampai anda menduplikat kembali  kode yang sudah dipaste.

     4.  Ganti kode diatas, dengan kode dibawah ini :

<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:post.snippet'>
<b:if cond='data:post.thumbnailUrl'>
<div class='Image thumb'>
<a expr:href='data:post.url' expr:title='data:post.title'><img alt='thumbnail' class='post-thumbnail' expr:src='data:post.thumbnailUrl'/></a>
</div>
<b:else/>
    <a expr:href='data:post.url' expr:title='data:post.title'><img alt='thumbnail' class='post-thumbnail' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMb6oAc5UChsbE-BfgUMmEEjjJZwsJyZA6gbR4LF3HDIAD_RwkfhYTGYpMgAle5HqSdr-FE022XES52WnN6n7PZnjO-26jbf1V1TKlaNvKXsst8ENH5n5W7II9l3hEp4lQqWzLBkDWPNyA/s0/no-image.png'/></a>
</b:if>
<data:post.snippet/>
<b:if cond='data:post.jumpLink != data:post.hasJumpLink'>
<div class='jump-link' style='float:right'>
<a expr:href='data:post.url' expr:title='data:post.title'>Readmore &#187;</a>
</div></b:if><b:else/>
<data:post.body/></b:if><b:else/>
<data:post.body/></b:if></b:if>

    5.  Cari kode dibawah ini : 

]]></b:skin>

    6.  Tekan Enter sebelum kode   ]]></b:skin>  , sehingga kode tersebut turun, Kemudian Paste kode dibawah ini.

.post-thumbnail {width:72px; height:72px; float:left; margin:0px 10px 0px 0px;}

    7.  Preview dahulu template Anda, dan save.

                                                                                      Semoga Bermanfaat