2How To Include Auto Read More In Blogger?

Posted by Harwinder Kumar at 6/08/2011 Posted in:

Including read more feature below posts gives professional look to your blog. As you can easily include read more in blogger by inserting jump break, but you would have to manually add it every time whenever you publish any post. So better is to make settings for auto read more option as it saves your time and also prevents from being confused about where to insert it at proper position in body content. Follow these simple steps:
  • Login to Blogger.
  • Go to Design> Edit HTML.
  • Backup your template.
  • Check the Expand Widget Templates.
  • Look for </head> by pressing Ctrl+F
  • Add the following code after </head>
<!--http://www.basicsofhacking.com/-->
<script type='text/javascript'>
var thumbnail_mode =&quot;yes&quot;;
summary_noimg = 430;
summary_img = 340;
img_thumb_height = 200;
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(thumbnail_mode == "yes") {
    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>
<!--http://www.basicsofhacking.com/-->
  • After that, find this code: <data:post.body/>
  • Replace that code with following code:
<!--http://www.basicsofhacking.com/-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<data:post.body/>
<b:else/>
<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>
<a class='more' expr:href='data:post.url'>Read more » </a>
</b:if>
</b:if>
<!--http://www.basicsofhacking.com/-->
  • Click preview & then save it.
Hope You Liked It. Receive Latest Posts Directly To Your Email
Get Free Updates:
Click On The Confirmation Link Sent To Your Inbox Or Spam

2 comments so far:

ANUP_ROCK said on 9/02/2011 4:19 PM:

You know any site name which is provide to send fake message any mobile number.Reply my emailid -
anupshukla1988@gmail.com

[Reply]
Harwinder said on 9/02/2011 10:40 PM:

check it: http://www.basicsofhacking.com/2011/05/send-anonymous-sms-from-bollywoodmotion.html

[Reply]

We love to hear from you! Leave us a comment:

© 2014 Learn The Basics Of Ethical Hacking About | Site Map | Privacy Policy | Contact