Installing the Auto Read More

Readmore One function is to display some of our posts so that on post pages not too long.to add it to our blog, the steps are as follows.1. Log in to blogger with your account2. Click the edit menu HTML3. Check the "Expand widget templates"4. Put this script on top of code </head> 

(Copy Paste aja kodenya)

<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>

Tips : Gunakan Ctrl+F, untuk memudahkan pencarian lalu isikan

5. Search codes <data:post.body/>(Use Ctrl + F, to facilitate the search and then fill <data:post.body/> if you have found, replace the code with 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)

- You can change the text readmore with words such as desired tone, Read More Etc.Readmore writing can also be changed with the image-sets to replace the text with scrip code address of the image you want to display, the code can be found at the site where you store images such as, 4shared, etc webpicasa.- To remove the title of the post after writing Readmore please delete code Readmore <data:post.title/> after writing it.

good luck, do not forget to comment Yua ...