Membuat Fungsi Read More (Versi 2)

Dulu pernah saya posting bagaimana membuat readmore. Dengan fungsi yang dulu pernah saya posting akan menghasilkan tampilan readmore pada blog dimana jika kita mengklik tautan/link "Selanjutnya..." maka kita akan menemukan postingan itu dalam keadaan utuh di halaman posting itu sendiri. Nah, untuk kali ini saya akan membahas readmore seperti yang saya gunakan di blog ini. Tautan tidak akan membawa kita ke halaman posting tapi tetap pada halaman awal blog.
Caranya sebagai berikut.

1. Buka akun blogger Anda
2. Pilih "Tata Letak" dan pilih "HTML", klik "Expand Template Widget"
3. Cari kode </head>
4. Copy kode berikut diatas kode </head>:

<script src='http://geocities.com/miracle34x/antoxite/readmore2.js'
type='text/javascript'/>

5. Cari kode ini:

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

6. Ganti kode tadi dengan kode ini:

<div class='post-body entry-content' expr:id='"post-" + data:post.id'>

<b:if cond='data:blog.pageType == "item"'>

7. Sekarang cari kode ini:

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

8. Tambahkan kode ini dibawah kode tadi:

<b:else/>
<style>#fullpost {display:none;}</style>
<p><data:post.body/></p>
<span id='showlink'>
<p><a expr:onclick='"javascript:showFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>[+/-] Selengkapnya...</a></p>
</span>
<span id='hidelink' style='display:none'>
<p><a expr:onclick='"javascript:hideFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>[+/-] Ringkasan...</a></p>
</span>
<script type='text/javascript'>checkFull("post-" + "<data:post.id/>")</script>
</b:if>

9. Klik "Simpan Template"
10. Sekarang Klik Tab "Pengaturan" dan pilih "Format"
11. Gulung layar kebawah dan temukan "Post Template", masukkan kode ini
<span id="fullpost">


</span>

12. Untuk postingnya, klik tab "Posting", pilih "Buat" atau jika melalui dashbor klik "Entri Baru"
13. Klik "Edit HTML" dan masukkan bagian postingan yang akan terlihat di halaman awal blog di atas kode <span id="fullpost"> dan sisanya taruh dibawah kode tadi dan pastikan diatas kode </span>

Selesai, jika ada yang ditanyakan silahkan bertanya melalui kotak komentar.

Baca juga artikel yang berhubungan: