Cara menambahkan Read More Pada blog

Menambahkan "Read more" bertujuan agar tulisan yang panjang tidak seluruhnya tampil biar tidak memakan tempat.

Langsung saja, langkah-langkah Menambahkan Read more di Blogger baru (layout template):

• Klik Layout > template > Edit HTML , Lalu beri tanda ceklis pada “Expand Widget Templates”
• Karena masing-masing struktur template berbeda maka pada kotak Edit Template cari salah satu kode berikut:

<div class='post-header-line-1'/>
atau <div class='post-header-line'>
atau <div class='post-body entry-content'>

• Untuk mencari kode tersebut, anda bisa tekan Ctrl + F untuk menampilkan kotak pencarian, kemudian copy paste salah satu kode diatas dan klik find
• Kalau sudah ketemu, Tahap pertama kita copy-paste kode berikut:

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

• Paste dibawah salah satu kode berikut yang ada pada template blog Anda,

<div class='post-header-line-1'/>
atau <div class='post-header-line'>
atau <div class='post-body entry-content'>

• Tahap kedua, copy kode berikut:

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

Paste dibawah kode <p><data:post.body/></p>

• Kalo petunjuk di atas sudah dilakukan, maka hasilnya akan seperti ini: (perhatikan warna biru sebagai kode tambahan)

<div class='post-body entry-content'>

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

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

<b:if cond=’data:blog.pageType != "item"’><br/>
<a expr:href=’data:post.url’>Read moreâ�¦</a>
</b:if>
</b:if>

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

• Jika sudah, Save template
• Sekarang, masuk ke SETTING > FORMATTING .Dibagian bawah ada tulisan Post Template (Template Posting), isi kotak dipinggirnya dengan kode berikut:

<span class="fullpost">

</span>

Klik SAVE (Simpan Pengaturan)

• Terakhir, setiap akan menambah postingan, klik Edit HTML dan sisipkan kode tersebut diantara postingan yang akan ditampilkan dan disembunyikan. Untuk menmbahkan kode tersebut, ketika posting kamu harus dalam mode Edit HTML bukan Compose

Contoh Penulisan posting:

Ini adalah awal berita yang ingin saya potong karena terlalu panjang kalo postingan muncul semua, oleh karena itu saya perlu memotong berita sampai disini saja. <span class="fullpost"> Dan ini adalah sisa postingan saya yang akan saya sembunyikan dan hanya muncul pada saat post page atau link read more.. diklik </span>

Hasil akhir postingan akan seperti ini:

Ini adalah awal berita yang ingin saya potong karena terlalu panjang kalo postingan muncul semua, oleh karena itu saya perlu memotong berita sampai disini saja.Read more..

Selamat Mencoba!