Auto Read more option for blogger posts

, Posted by ngsk at 4:11 AM

You might have known about Read more option for blogger posts. You might have already inserted that option in your blogs. If not here is one simple and small method to insert.

Previously you might have inserted Read more option using
<Span class=”fullpost”> </span>
and inserting expandable post between this code. If you are using this code you have to insert this code in each and every post. If you are inserting this code for first time and you have already having so many posts then you have to edit each and every post this is time consuming.

Before going for this trick Save your template.
To save your template
Go to the Layout tab, and click Edit HTML.
Download your template as an XML-file and save it onto your harddisk. If anything goes wrong, upload it again and not much harm will be done.

But here is a simple method which saves your time and after inseting this code your blog main page will look as below.




Step 1: Go to Edit Html page and check Expand widget template check box and search for below code.

<div class='post-body entry-content'>
<p><data:post.body/></p>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>

OR just search for below code

<p><data:post.body/></p>

Step 2: Replace the line marked in red color in above code with below code.


<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" + data:post.id'/>
<script type='text/javascript'>
var blogID = "Your Blog ID";
function retriveSummaryPost<data:post.id/>(json){document.getElementById("summary<data:post.id/>").innerHTML
= json.entry.summary.$t + "..."}
function createSummaryPost<data:post.id/>(POSTID){ var script = document.createElement("script");
script.src = "http://www.blogger.com/feeds/"+blogID+"/posts/summary/"+POSTID+"?alt=json-in-script&amp;callback=retriveSummaryPost<data:post.id/>";
script.type = "text/javascript"; document.getElementsByTagName('head')[0].appendChild(script);}
</script>
<script type='text/javascript'>
createSummaryPost<data:post.id/>("<data:post.id/>");
</script>
<span class='rmlink' style='float:right'><a expr:href='data:post.url'>-->Read more...</a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<div id='post_body'>
<data:post.body/>
</div>
</b:if>


Now replace “Your Blog ID” with your ID
How to find your Blog ID.

Log into Blogger dashboard and click on Layout link now you can find your Blog id in link bar as shown in image below.