Membuat Read More Otomatis dengan Thumbnail Blogger

Masih ada pengguna Blogger membuat Read More pada blog mereka, dengan cara menambahkan tag <span id=”fullpost”> .... </span> setiap menulis posting pada blog yang dinilai Blogger terlalu rumit dengan segala keterbatasanya. Sehingga muncul cara Membuat Read More Otomatis dengan Thumbnail Blogger, berikut ini cara yang mudah untuk membuat Read More Otomatis dengan Thumbnail di Blogger secara singkat dan mudah :

• Silahkan Login dan masuk pada Edit Template.
• Tambahkan kode dibawah ini diatas kode </head> :

  <script type='text/javascript'>
  var thumbnail_mode = "float" ;
  summary_noimg = 250;
  summary_img = 250;
  img_thumb_height = 120;
  img_thumb_width = 120;
  </script>
  <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 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>

  Ubah angka di atas sesuai kebutuhan :
  summary_noimg = 430; → Tinggi potongan artikel tanpa gambar.
  summary_img = 340; → Tinggi potongan artikel dengan gambar.
  img_thumb_height = 100; → Ukuran tinggi thumbnail.
  img_thumb_width = 120; → Ukuran lebar thumbnail
• Selanjutnya cari kode <data:post.body/> kmeudian ganti dengan kode berikut dibawah ini :

  <b:if cond='data:blog.pageType != "item"'>
  <div style=' text-align: justify;' expr:id='"summary" + data:post.id'><data:post.body/></div>
  <script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
  <span class='rmlink' style='float:left'><a expr:href='data:post.url'>READ MORE</a></span>
  </b:if>
  <b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>