Add auto Readmore function with Thumbnail feature in Blogger



This nice tweak will create auto summaries for your blog with thumbnail and you will not have to add any code in your every post.It is also very useful if you have changed your blogger template because in that case,your older read more function will not work.But this one will work for your every post.

1.Login to your Blogger Dashboard--->Layout--->Edit HTML.
2.Click on Expand Widget templates and search for </head> in your template.
3.Now add below code just before </head> in your template.
<script type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 230;
summary_img = 140;
img_thumb_height = 100;
img_thumb_width = 100;
</script>
<script src='http://keerthiset2.110mb.com/excerpt.js' type='text/javascript'/>

4.Now search for <data:post.body/> in your template and replace this code with following piece of code:
b:if cond='data:blog.pageType == "item"'>
<data:post.body/>
<b:else/>
<div expr:id='"summary" + data:post.id'>
<data:post.body/>
</div>
<script type='text/javascript'>
createSummaryAndThumb("summary<data:post.id/>");
</script>
<div style='clear: both;'/>
<span style='padding-top:5px;;float:right;text-align:right;'><a expr:href='data:post.url' rel='bookmark'><b>Reade more >></b></a></span>
</b:if>

5.Now click save template and you are done!!!
Happy Blogging!!!!!!!!




Share your views...

0 Respones to "Add auto Readmore function with Thumbnail feature in Blogger"

Post a Comment

You need not to login for making a comment.So please do comment about this post/trick.

 

© 2010 The Tech Pirate|Blogger Tutorials,Facebook Tips,Web News,PC Softwares & More... All Rights Reserved