Friday, April 16, 2010

How To Add Auto Readmore In Blogspot

with auto readmore you can place readmore in the post to cut your blogpost with out insert a jumpbreak or wiht span or div tag. and this script without a hosting to upload your script ^_^ ok lets do it.


go to your dasboard, template and then edit html and check expand widget template.

1. if you have been add the readmore with in span tag or div tag, you must dellete the red code :

<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;'/>

2. and then find </head> and copy this code before it.

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

3. and then replace this code <data:post.body/> with this code:

<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 == "item"'><data:post.body/></b:if>

4. save and then you can see autoreadmore in your blog ^_^

do not forget to come back and see my next blogpot at blogspot


Simmilar Posts by Categories


3 comments:

DOCsubtitles said...

I'm sorry is this still working? I already have it on my template but it also modify the static pages and I don't know what I have to do to let them show fully. Can you help me? Thank you!!

Autoreadmore said...

yes, that codes still working, if your autoreadmore code not working, please check are you ever use old readmore using <span class or <div class if you use it before, yuu must remove your old readmore before

UGG 公式通販 said...

毛皮のコートだ靴は今年に入って「千年の极寒説」の下でますます流行しただけでなく、

Post a Comment