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.
Keuntungan trik ini dapat memperingan loading Blog kita seperti postingan saya yang sebelumnya Beberpa trik mempercepat loading Blogspot. Oke dah langsung di coba triknya, tapi ingat dikebalikan dulu jika Anda sudah memakai trik read more dengan Java Script, dengan membaca trik auto read more dengan java script pasti Anda bisa mengembalikannya lagi
Keuntungan trik ini dapat memperingan loading Blog kita seperti postingan saya yang sebelumnya Beberpa trik mempercepat loading Blogspot. Oke dah langsung di coba triknya, tapi ingat dikebalikan dulu jika Anda sudah memakai trik read more dengan Java Script, dengan membaca trik auto read more dengan java script pasti Anda bisa mengembalikannya lagi
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.
Semoga berhasil dan bermanfaat, sampai ketemu di artikel selanjutnya.
No comments:
Write komentar