MEMBUAT AUTO READ MORE THUMBNAIL TANPA JAVA SCRIPT

blogger templates


Auto Read More Thumbnail Tanpa Java Script, seperti yang Anda ketahui outo read more memang sudah di berikan di fitur Blogger namun masih banyak blogger menggunakan Java Script untuk membuat auto read more tersebut. Setelah sudah lama tidak berseluncur dan menggarap sebuah template request ternyata eh ternyata trik read more bisa tanpa menggunakan Java Script.

Auto Read More tanpa Java Script

Pertama saya berikan tutorial ini masih dengan tampilan lama blogger. Login akun blogger (pastinya), masuk ke design kemudian edit HTML beri centang kotak kecil disamping tulisan Expand Widget Templates. cari kode <data:post.body/>ganti dengan kode berikut ini,

<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:post.snippet'><b:if cond='data:post.thumbnailUrl'>
<div class='Image thumb'>
<img expr:src='data:post.thumbnailUrl'/>
</div></b:if>
<data:post.snippet/>
<b:if cond='data:post.jumpLink != data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + "#more"' expr:title='data:post.title'><data:post.jumpText/></a>
</div></b:if>
<b:else/><data:post.body/></b:if>
<b:else/><data:post.body/></b:if>

Kemudian sedikit penambahan CSS, taruh kode CSS berikut diatas kode ]]></b:skin>

.thumb img {float: left; margin: 0 10px 10px 0;} 

Jika sudah Klik Save Template lihat hasilnya