Membuat Read More (baca selengkapnya) di blogger baru

Pasti sudah pada tau fungsinya read more (baca selengkapnya). Tutorialnya pun sangat banyak. tapi saya coba menampilkannya lagi untuk menambah koleksi tutorial blogspot pada blog ini.

Fungsinya yaitu untuk menghemat pemakaian halaman posting pada halaman awal (home) blog kita. Jadi pembaca tidak perlu repot-repot menggulung layar jauh kebawah untuk melihat semua postingan pada blog kita.Pada sebagian template, biasanya sudah ada read more-nya. Apalagi bagi yang punya kemampuan design template sendiri. Tapi bagi anda yang belum punya dan ingin pasang read more tanpa repot ganti template, cara pasangnya sebagai berikut:

1. Login ke akun Blogger anda

2. Klik Layout

3. Klik Edit HTML dan beri centang Expand Widget Template
4. Backup Template Blog anda dengan cara Download Full Template untuk berjaga-jaga bila nantinya terjadi kesalahan.

5. Masukkan kode berikut sebelum tag </head> atau tepat sesudah kode ]]></b:skin>

<style>
<b:if cond='data:blog.pageType == "item"'>
span.fullpost {display:inline;}
<b:else/>
span.fullpost {display:none;}
</b:if>
</style>

6. Agar tulisan postingan terpotong, cari kode <data:post.body/> dan tambahkan kode berikut tepat dibawahnya:

<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'> Read More..</a>
</b:if>

7. Supaya terpotong, klik pada bagian yang ingin anda tampilkan read more pada postingan anda, dan ketik/letakkan kode <span class="fullpost"> disitu, kemudian tambahkan </span> pada bagian akhir tulisan anda.

Contoh:
Ini adalah bagian awal postingan kita. Saya ingin memotongnya sehingga tidak semua kalimat tulisan ini akan muncul. <span class="fullpost"> dan ini adalah tambahan tulisan yang akan muncul setelah link read more di klik.</span>

Maka hasil akhir akan tampil sebagai berikut:

Ini adalah bagian awal postingan kita. Saya ingin memotongnya sehingga tidak semua kalimat tulisan ini akan muncul.Read More..

Tulisan "Read More" yang berwarna biru diatas bisa diganti sesuai keinginan anda, misalnya 'Baca Selengkapnya" atau "Lanjutkan Membaca", dll.

Klik disini untuk mengganti tulisan "Read More" dengan gambar.

Nah, selamat mencoba...