Ads

Membuat Readmore Otomatis Tanpa Javascript

Banyak cara yang dapat kita gunakan untuk membuat readmore atau selengkapnya, namun pada kesempatan kali ini saya akan membahas bagaimana membaut readmore otomatis tanpa javascript. Sebenarnya membuat readmore otomatis sudah pernah saya bahas ada kesempatan yang lalu, akan tetapi menggunakan kode javascript dan thumbnail. Sebagaimana yang kita ketahui bersama bahwa salah satu faktor yang menyebabkan lambatnya loading sebuah blog itu dikarenakan banyaknya kode javascript yang terdapat dalam blog tersebut. Untuk itulah saya memiliki alternatif bagaimana membuat readmore otomatis tanpa javascript, sehingga kecepatan loading blog Anda dapat maksimal.


Untuk cara penerapannya tidaklah sulit, jika Anda tertarik menggunakan readmore otomatis tanpa javascript ini, maka perhatikan penjelasan yang akan saya trangkan berikut ini:

1. Login ke account blogger Anda

2. Klik rancangan atau jika Anda menggunakan dasbor blogger baru maka klik tataletak

3. Lalu klik Edit HTML (lihat pada bagian atas)

4. Kemudian beri tanda ceklis atau centang pada kotak kecil Expand template widget

5. Download lengkap template anda terlebih dahulu untuk meminimalisir resiko jika terjadi kesalahan

6. Selanjutnya Anda cari kode <data:post.body> (gunakan ctrl + f untuk memudahkan pencarian

7. Jika sudah mendapatinya ganti kode tersebut 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>

8. Langkah selanjutnya adalah, cari kode </ b: skin> lalu tambahkan kode berikut ini tepat diatasnya


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


9. Klik pratinjau untuk melihat hasil sementara, jika sudah sesuai maka


10. Save


Untuk pengaturan teksnya Ada bisa mengaturnya dengan cara :


1. Pada menu rancangan, pilih "edit" pada posting blog


2. Tuliskan teks yang Anda inginkan, lihat gambar dibawah ini

readmore otomatis

3. Lalu save dan lihat hasilnya

Catatan: Jika Anda sudah membuat redmore otomatis sebelumnya, maka hapus kode yang telah Anda tambahkan, jika tidak maka readmore dalam halaman postingan blog Anda memiliki readmore double.

0 comments on Membuat Readmore Otomatis Tanpa Javascript :

Post a Comment