Kok artikelnya pake versi? Kayak software aja? Hikz.. hikz..! Tapi apa maksudnya?
Begini.. Di cara membuat read more sebelumnya atau boleh dibilang versi 1, jika kita klik link read more nya maka browser akan meload lagi halaman web kita. Di versi 2 ini, jika kita klik link read more maka keseluruhan isi artikel akan langsung tampak di bawahnya. Jadi tidak meload halaman baru. Mau tau gimana caranya?

Berikut Cara Membuat Read More Dengan Javascript:

1. Login ke akun Blogger anda

2. Pilih Layout > Edit HTML, lalu centang Expand Widget Templates.

3. Cari kode </head> lalu pastekan kode berikut tepat di atasnya:

<script src='http://tipsbloggerzacky.googlecode.com/files/readmorev2.js' type='text/javascript'/>

4. Jika sudah, cari kode <div class='post-header-line-1'/>, di bawahnya kan ada kode <div class='post-body entry-content'>. Ganti kode tersebut menjadi seperti ini:

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

5. Sudahkan? Selanjutnya cari kode <p><data:post.body/></p>, paste kode berikut tepat di bawahnya:

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

6. So, seluruh kode tadi menjadi seperti ini:

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

Tulisan Selengkapnya... dan Ringkasan... bisa anda ganti sesuai keinginan.

7. Klik Save Template untuk menyimpan perubahan
8. Selanjutnya pilih menu Setting > Formatting
9. Scroll ke bawah dan temukan kotak Post Template, lalu paste kode berikut kedalamnya:

<span id="fullpost">

</span>

10. Klik Save Settings

Dalam membuat postingan, letakkan abstraksi / pembuka postingan anda sebelum kode <span id="fullpost"> dan sisa nya letakkan diantara kode <span id="fullpost"> dan </span>.

Huft,,, selesai sudah semuanya… cape’ juga ane… eh tunggu dulu, masih ada dikit lagi nih..!

Lalu gimana buat yang sudah pakai read more versi 1? Ya tinggal update aja ke situs providernya… eh, kok malah kayak software?
Begini, buat yang sudah pakai read more versi 1, anda tinggal mengubah sedikit kode read more yang lama..

Caranya:
1.Kode read more yang lama kan seperti ini:

<div class='post-header-line-1'/>
<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>
<a expr:href='data:post.url'>Read More......</a>
</b:if>

2. Hapus kode yang berwarna biru lalu ikuti langkah2 di atas.

3. Jangan lupa ubah juga isi Post Template dengan:

<span id="fullpost">

</span>

Gimana? Udah ngertikan? Ngerti aja ya? Ane udah cape’ nih..

Selamat mencoba…

Jangan lupa kasih komentar ya…