Cara Membuat Auto Readmore dengan Gambar Tanpa Javascript di Blogspot

Membuat Auto Readmore pada blogspot menjadi bahan pembicaraan kemarin saat ngumpul dengan beberapa pengguna blogspot. Mereka mengeluhkan kecepatan laoding blogspot mereka yang setelah diberi script untuk auto readmore plus gambar ternyata malah menambah beban loading blog. Bahkan setelah di cek di google speed rata-rata turun 5 point, ya karena yang mereka gunakan adalah script Auto Readmore menggunakan Java script. Nah bagaimana mengatasi kecepatan loading yang menurun akibat menggunakan Auto Readmore dengan Gambar ala javascript ? tentu jawabannya mengganti dengan Script Auto Readmore Tanpa Javascript.

Bagaimana Cara Membuat Auto Readmore Dengan Gambar Tanpa Javascript

1. Login Ke Blogger.com.
2. Klik Rancangan>> Edit HTML>> Expand Template Widget.
3. Cari kode seperti dibawah ini:
<data:post.body />

4. Ganti dengan kode dibawah ini:

<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<br/>
<data:post.body/>
<b:else/><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></b:if>

5. Simpan Template.

Dan untuk tampilan CSS pada thumnail, tambahkan kode dibawah ini sebelum </b:skin>

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

Simpan dan lihat hasilnya…
Selamat Mencoba dan Semoga Bermanfaat..

Jangan Lupa Komentarnya....

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s