Membuat Read More Versi II

Kali ini akan saya tuliskan cara membuat read more di blogger versi II. Pembaca dapat melihat cara membuat read more versi I pada postingan terdahulu. Perbedaannya ialah versi I akan menuju halaman baru jika diklik link read more. Sedangkan Versi II tidak demikian karena tulisan selanjutnya akan muncul dibawahnya tanpa membutuhkan halaman baru seperti yang terjadi pada versi I. Berikut cara pembuatannya:

1. pastikan udah log in ke blogger

2. Lalu selanjutnya ke menu Layout terus Edit HTML

3. Jangan lupa Backup Template dan juga Centang "Expand Widget Templates"

4. Pasang Code dibawah tepat diatas Code </head>.

<script src='http://anas.ku93.googlepages.com/readmore-2.js' type='text/javascript'/>

5. Kemudian kamu Cari code kaya dibawah

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


6. Ganti code diatas hingga menjadi dibawah

<div class='post-header-line-1'/> <div class='post-body entry-content' expr:id='"post-" + data:post.id'>
<b:if cond='data:blog.pageType == "item"'>


7. Kemudian setelah anda ganti dibawah Code diatas ada Code
<p><data:post.body/></p>

8. Kemudian dibawah Code diatas tambah Code seperti ini

<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. Kurang lebih Semuanya menjadi seperti dibawah

<div class='post-header-line-1'/> <div class='post-body entry-content' expr:id='"post-" + data:post.id'>
<b:if cond='data:blog.pageType == "item"'>
<p><data:post.body/></p>

<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>

Catatan : Tulisan yang tercetak tebal diatas bisa kamu ganti sesuai selera kamu, itu adalah link Read more

10. Langkah Pertama selesai kemudian Save Tempaltes

11. Kemudian Ke langkah selanjutnya yaitu ke menu Setting --> Formatting

12. pada Kotak "Post Tempaltes" isikan Code dibawah ini
<span id="fullpost">


</span>


13. Kemudian Simpan

Selamat Mencoba!!!