Pasang Auto Readmore Serta Gambar Tanpa Javascript

Auto Readmore ini sangatlah simple dan ringan loading, karena hanya mengandalkan HTML sebagai andalan dengan menciptakan efek Readmore. Memang banyak sekali blog tutorial menyuguhkan Auto Readmore, namun sayang sekali karena kebanyakan menggunakan Javascript sebagai andalan untuk pemanggilan.

Simpan kode ini di atas ]]></b:skin> atau </style>

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

Anda dapat rubah ukuran gambar dengan width 72px sama height 72px, silahkan sesuaikan dengan tampilan yang anda kehendaki.

Cari kode <data:post.body/>. biasanya ada empat, silahkan pasang kode HTML ini pada <data:post.body/> yang kedua.

<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/AVvXsEiomXljEb51Mnmz8ayFyjEI9v0Bkxyc4gUwrWLY3S-wFqCO5AkhDayBJ-JPLxkCz832_xEGq7bo0ZXd7CFqX_SnnVLj0ep3pyM93pCkqB8HTbxy4s3lgrHIJz6RyAvA5LzpgkERolhcKsPU/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>