Membuat Read More (Baca Selanjutnya) atau Postingan Ekspandabel di blogspot

Jika sahabat telah mengganti template blog sahabat, mungkin sahabat akan merasa ada sesuatu yang kurang dari tampilan baru blog sahabat. Coba perhatikan, tidakkah artikel blog sahabat terlihat terlalu panjang ?. Jika sahabat membuat artikel dengan panjang tertentu, maka seluruh bagian artikel tersebut akan ditampilkan. Hal ini membuat blog sahabat tampil kurang menarik dan merepotkan pembaca untuk melihat semua judul artikel pada halaman depan blog sahabat.

Hal itu terjadi karena sahabat belum menambahkan kode “Read More” (Expandable Post Summaries) pada template sahabat. Jika sahabat telah menambahkannya, maka hanya sebagian dari artikel sahabat yang akan ditampilkan. Sisanya akan disembunyikan dan baru ditampilkan bila sang pembaca tertarik untuk melanjutkan bacaannya dan menekan link atau button “Read More”.

Jika sahabat tertarik untuk membuatnya maka caranya adalah berikut ini:

1. Masuklah ke akun blogger. Com sahabat
2. Cek bagian Setting lalu cek halaman formatting
3. tambahkan kode berikut pada kotak post template
<span class="fullpost">

</span>Lalu Masuk ke bagian layout

4. Save
5. Masuk ke halaman layout, cek edit Template
6. Cek kotak expand template widget
7. Ada baiknya melakukan download semua template sahabat. Jika nanti ada kesalahan sahabat tinggal menguploadnya kembali
8. Temukan kode berikut:
<div class='post-header-line-1'/>
<div class='post-body'>
(Bisa Juga seperti: <div class='post-body entry-content'>, Cari saja yang paling mirip)
9. Jika sudah, Tambahkan kode berikut di bawahnya:

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

10. Lihat ke bawah, sahabat akan menemukan kode:

<p><data:post.body/></p>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>

11.Nah, di antara kode:

<p><data:post.body/></p>

dan

<div style='clear: both;'/> <!-- clear for photos floats -->

Tambahkan kode berikut:

<a expr:href='data:post.url'>Baca Selanjutnya>></a>
</b:if>

12. Jika sudah simpan template sahabat.


Sekarang cobalah untuk mengedit salah satu postingan sahabat:

Tambahkan Kode:
<span class="fullpost">

</span>

Caranya:
1. Ketik Edit HTML
Pilihlah bagian yang sahabat inginkan sebagai summary artikel sahabat, atau yang akan ditampilkan di halaman blog sahabat. Letakkan kode:

<span class="fullpost">

setelahnya.
2. Kode

</span>

sahabat tempatkan di bagian paling bawah, sehingga bagian artikel yang akan tersebunyi berada di antara kode

<span class="fullpost">

Dan

</span>

2. Jika sudah, simpan kembali artikel sahabat.
3. Coba lihat tampilan blog sahabat yang baru.
4. Selesai.

Artikel Terkait