Baca Selengkapnya (auto read more ) di Blogger

Membuat "baca selengkapnya" atau "auto read more" diblogger. Setelah lama mencari akhirnya saya menemukan juga cara membuat auto read more pada blogger. pada penjelasan metode kali ini adalah membuat "baca selengkapnya" atau auto read more secara otomatis , maksudnya dalam setiap posting kita tidak perlu untuk meletakan kode diawal dan diakhir tulisan yang akan kita tampilkan. Metode ini secara otomatis akan memotong pada bagian tertentu sesuai dengan yang kita tetapkan dalam awal settingan. Baiklah tidak usah berpanjang lebar berikut langkah-langkahnya:
Catatan:

Bagi anda yang pernah memasang read more manual harap dihapus terlebih dahulu kodenya sebelum memasang kode auto read more.

1. Login ke Blogger dan masuk Design > Edit Html.
2. Centang kotak "Expand Widget Templates"
3.  Backup Templete dengan  download full templete.
4. Cari kode </head> dan tempatkan kode berikut tepat diatasnya
   

   <script type='text/javascript'>
   //<![CDATA[
   function removeHtmlTag(strx,chop){
   if(strx.indexOf("<")!=-1)
   {
   var s = strx.split("<");
   for(var i=0;i<s.length;i++){
   if(s[i].indexOf(">")!=-1){
   s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
   }
   }
   strx = s.join("");
   }
   chop = (chop < strx.length-1) ? chop : strx.length-2;
   while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
   strx = strx.substring(0,chop-1);
   return strx+'...';
   }
   function createSummary(pID){
   var div = document.getElementById(pID);
   var summ = 300;
   var summary =  removeHtmlTag(div.innerHTML,summ) + '</div>';
   div.innerHTML = summary;
   }
   //]]>
   </script>

   Keterangan: var summ = 300;Untuk merubah jumlah lebar yang ditampilkan
   
   
5. Kemudian cari <data:post.body/> atau <p><data:post.body/></p>
   
6. Ganti kode tersebut dengan kode dibawah ini
   

   <b:if cond='data:blog.pageType != &quot;item&quot;'>
   <div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
   <script type='text/javascript'>createSummary(&quot;summary<data:post.id/>&quot;);</script>
   <span class='rmlink' style='float:left'><a expr:href='data:post.url'><b>Baca Selengkapnya &#187;</b></a></span>
   </b:if>
   <b:if cond='data:blog.pageType == &quot;item&quot;'><p><data:post.body/></p>
   </b:if>

7. Simpan Templete anda dan lihat hasilnya.

Sebenarnya tutorial aslinya adalah read more ditambah dengan gambar, dikarenakan gambar yang di tampilkan jadi ngak karuang jadi saya modifikasi demikian. kalau mau coba yang di tambah gambar  di http://www.hermanblog.com/.

Selamat mencoba..