Cara membuat auto readmore tanpa javascript

Adapun kerugian nya dari konsep auto readmore ini yaitu gambar thumbnail atau gambar ringkasan yang berukuran kecil, dan ringkasan artikel yang sedikit tidak bisa diubah (dengan jumlah karakter yang sedikit karena digunakan di tema mobile).
Cara membuat auto read more tanpa javascriptnya adalah sebagai berikut:
1. Masuk ke menu edit html, saya sarankan download terlebih dahulu templatenya sebagai antisipasi jika kamu melakukan kesalahan.
2. Centang menu Expand Template Widget, cai kode dibawah ini :

<data:post.body/>

ATAU

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

3. Biasanya ada dua kode seperti kode diatas, Ganti dengan kode nya yang pertama dari atas dengan kode dibawah ini:

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>

<b:if cond='data:post.thumbnailUrl'>

<div class='post-home-thumbnail'>
<div class='Image-home'>
<img expr:src='data:post.thumbnailUrl'/>
</div>
</div>

<b:else/>

<div class='post-home-thumbnail'>
<div class='Image-home'>
<img border='0' height='95' src='http://1.bp.blogspot.com/-LURPGoux60I/TlZ1QtKs5RI/AAAAAAAAaSY/wtdCWh3uyLw/s1600/no-image.png' width='95'/>
</div>
</div>
</b:if>

<div id='post-home'>
<b:if cond='data:post.snippet'>
<data:post.snippet/>
</b:if>
</div>

<div class='readmore'>
<b:if cond='data:blog.url != data:post.url'>
<a expr:href='data:post.url'>Read More</a></b:if>
</div>

<b:else/>

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

<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<p><data:post.body/></p>
</b:if>

4. Sekarang cari kode  ]]></b:skin> dan simpan CSS ini diatasnya:

/*Css gambar ringkasan auto readmore nya*/
.post-home-thumbnail img{
float:left;
margin:0 5px 0 0;
width: 75px;
height:75px;
}
/*css untuk link readmorenya*/
.readmore {
float:right;
font-size:11px;
}

5. Simpan template


Baca Juga Ini Cara Melihat Blog Terindex