Read More how to make automatic

(Revised: Solutions without hosting the files. JS) Function Read More emang somewhat different this time with an older version of Read More (part 1). If a previous version we had to cut paper use the manual way to perform the functions pemangilan <div class="fullpost"> .. </ div> or <span class="fullpost"> .. </span> where the code is usually our implanted manually into the posting page. For the latest version of the Auto Read More this time seemed more sophisticated, because the function of beheading sentence should work automatically without having to add the code above.

Continue .. another great, Read More functions are capable of representing the first image in the post and made ​​fload image is in the beginning of paragraphs earlier, even though the picture we put in the middle or end of the posting. Possibly, more comfortable I call it with a thumbnail image facility.

Not only that, we can also control the number of characters displayed. Here there are 2 options for the number of characters. The first, the number of characters that is displayed if there are images included in posts and secondly the number of characters without an image. Still confused about? same .. which jelasin also slaphappy wkwkwkw Well, let both directly into the tutorial not dizzy just ok.

Important! Which has put Read More old version of the code should first return to as they are, how to remove the red code below (Each template may be different, so stay adjusted only)

<div class='post-header-line-1'/>
<div class='post-body'>
<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<p><data:post.body/></p>
<a expr:href='data:post.url'>Readmore</a>
</b:if>
<div style='clear: both;'/>

OK, if you've been living continue with the tutorial below.

First, please go directly to the page EDIT HTML, Find the code </ head> then put this script in the above code </ head> If so, do not forget at the store first.

Directly copy paste the code below:

<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[
/******************************************
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>


 Still on page EDIT HTML, Tick the "Expand widget templates" and then find the code like below

<data:post.body/>



If so, replace the code <data:post.body/> with all the code below

<b:if cond='data:blog.pageType != "item"'>
<div 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 - <data:post.title/></a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>


 Please be saved and see the results:)

Description:

var thumbnail_mode = "float", (we can decide whether the location of the thumbnails are in (float) left, or if not, please replace the (no-float)
summary_noimg = 250; (Define how many characters will be displayed in the post without a picture / thumbnail)
summary_img = 250; (Define how many characters will be displayed on the posts with image / thumbnail)
img_thumb_height = 120; (Thumbnail height in pixels)
img_thumb_width = 120; (Thumbnail width in pixels)

Good luck .. happy with a tutorial ..