Membuat read more

Pada saat kita posting, kadang kala tulisan kita terlalu panjang untuk ditampilkan dibagaian halaman muka. Untuk menanggulanginya, banyak para blogger menggunakan konsep readmore agar posting ditampilkan sebagain.
Naha saya ingin berbagi pengalaman cara menggunakan readmore pada posting blog kita. Setelah mencoba beberapa trik yang saya dapatkan hasil searching di internet maka cara ini paling bagus menurut saya (catatan : script ini saya coba pada template baru/xml).
Ikuti langkah - langkahnya :

1. Login ke account blog anda
2. Pilih menu layout/tata letak
3. Klik bagain edit HTML
4. tampilkan fasilitas pencarian dengan Ctrl+F
5. cari script berikut ini </head>
   
6. Pada bagain atas script tadi, tambahkan java script ini <!--script kesatu untuk readmore-->
   <script type='text/javascript'>
   var thumbnail_mode = &quot;float&quot; ;
   summary_noimg = 250;
   summary_img = 250;
   img_thumb_height = 120;
   img_thumb_width = 120;
   </script>
   
   
   <script type='text/javascript'>
   //<![CDATA[
   /******************************************
   Auto-readmore link script, version 2.0 (for blogspot)
   
   (C)2008 by Anhvo
   
   visit http://en.vietwebguide.com to get more cool hacks
   ********************************************/
   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 createSummaryAndThumb(pID){
   var div = document.getElementById(pID);
   var imgtag = "";
   var img = div.getElementsByTagName("img");
   var summ = summary_noimg;
   if(img.length>=1) {
   imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
   summ = summary_img;
   }
   
   var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
   div.innerHTML = summary;
   }
   //]]>
   </script>
   <!--akhir script kesatu untuk readmore-->
   
   
7. Simpan template anda
   
8. Masih pada bagian edit HTML beri tanda tik/centang pada tulisan expand widget template
9. cari script seperti ini <div class='post-body entry-content'> <data:pot.body/>
   
10. Ganti script <data:pot.body/> dengan secript yang kedua <!--script kedua readmore-->
    <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'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script>
    <span class='rmlink' style='float:left'><a expr:href='data:post.url'>READ MORE - <data:post.title/></a></span>
    </b:if>
    <b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>
    <!--akhir script kedua readmore-->
    
11. Simpan kembali template anda
12. Lihat hasilnya

mudah mudahan membantu
mohon maaf saya lupa sumber script ini, anggap saja ini hanya tulisan buat saya supaya tidak lupa