Membuat Read More Versi Kedua

Kali ini Saya mau menulis tentang cara memasang read more versi kedua, opppsss pada perjumpaan kemaren Saya udah nulis yang versi pertema.
Saya akan jelaskan perbedaan antara versi pertama dan versi kedua gini yaa kalau versi yang pertama jika kamu klik link read more akan mengarahkan ke halaman baru, nah jika yang versi kedua ini yaitu jika anda klik link read more sisa postingan akan muncul dibawahnya atau dihalaman yang sama tanpa membuka halaman baru.
Nah sekarang anas akan memberikan sedikit ilmu tentang cara membuat read more versi kedua ini ni ikuti yaa

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 Templates
    
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 dan langkah Terakhir adalah ..... Hore... Hore.....

Tips:
Ini adalah postingan yang di tempatkan dihalaman muka sebelum Code <span id="fullpost">
Dan disini adalah sisa postingan yang akan muncul jika anda klik link read more
</span>

Sekian yah semoga bermanfaat

Artikel Terkait