Filled Under:

Creating Auto Readmore In Blogspot

Log in blogger.
Go to the layout
Log in to edit html
Download your template first before doing the installation.
Stain expand widget
Find the code 

</head> then put this script in the code </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>

Stay on EDIT HTML pages, Tick the "Expand widget
template "then this code
<data:post.body/> if
have found, then 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>
When finished press save the template.
 
explanation :
 
var thumbnail_mode = "float"; (we can decide whether the layout thumbnail in the (float) left or if not, please replace the (no-float)
summary_noimg = 250 ; (Define how many
character will be displayed in the post without a picture / thumbnail)
summary_img = 250 ; (Define how many characters will be
displayed in the post with the picture / thumbnail)
img_thumb_height =
120 ; (Thumbnail '
Height in pixels)
img_thumb_width = 120 ;
(Thumbnail '
Width in Pixel)     





0 Comment:

Post a Comment

Please comment here, do not be shy and feel free to leave comment here. Devote all your opinion. But don't spam.