Auto Readmore Blogger Widget

CSS

.continue-readingnbt {
 background: #EEE;
 background: -moz-linear-gradient(top, #FBFBFB 0%, #E5E5E5 100%);
 background: -webkit-linear-gradient(top, #FBFBFB 0%, #E5E5E5 100%);
 background: linear-gradient(to bottom, #FBFBFB 0%, #E5E5E5 100%);
 display: inline-block;
 float: right;
 padding: 2px 10px;
 color: #555;
 border: 1px solid #CCC;
 border-radius: 4px;
    text-decoration: none !important;
}
.continue-readingnbt:hover {
 border-color: #AAA;
 color: #333;
}

Javascript

<!-- Auto Read More Body Script Start -->
<script type='text/javascript'>
summary_noimg = 400;
summary_img = 300;
img_thumb_height = 150;
img_thumb_width = 200; 
</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 = '<img src="'+img[0].src+'" style="margin-right:10px;" class="bjtthumbimg"/>';
  summ = summary_img;
 }
 
 var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
 div.innerHTML = summary;
}

//]]>
</script>
<!-- Auto Read More Body Script End -->

Implementasi

Cari <data:post.body/> ganti degan kode berikut:

<!-- Auto Read More Body Start -->
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<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>
</b:if>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'><data:post.body/></b:if>

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div style='float:right;padding-right:0;margin-top:5px;'>
<a class='continue-readingnbt' expr:href='data:post.url'>Read More</a>
</div>
</b:if>
</b:if>
<div style='clear: both;'/> <!-- clear for photos floats -->
<!-- Auto Read More in Body End -->