post summary with thumbnail blogger

Just put this code above </head>

<b:if cond="data:blog.pageType == &quot;index&quot;">

<script language="javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js" type="text/javascript">

<script type='text/javascript'>//<![CDATA[

/**

this script was written by Confluent Forms LLC http://www.confluentforms.com

for the BlogXpertise website http://www.blogxpertise.com

any updates to this script will be posted to BlogXpertise

please leave this message and give credit where credit is due!

**/



$(document).ready(function() {

    //change the dimension variable below to be the max pixel width you want the thumbnails to be

    var dimension = 90;

    

    // set this to be the word count of the lead-in

    var words = 80;

    

    // set this to be left, right, none or inherit

    var orientation = "left"; 

    

    // set 1 for squared image or 0 for proportional,

    // squared images only works for images hosted in Picasa

    var square = 1;

    

    // continuation of the introduction paragraph

    var addon = "...";

    

    // optional read more link, leave empty if you don't want it

    var readmore = "read more";

    

    // image margins such as 1em or 5px

    var margin = "1em";

    

    $('.post-body').each(function(n, wrapper){

        var newContents = "";

        var wrapper = $(wrapper);

        var image = $(wrapper).find('img').first();



        var textContents = wrapper.text().split(' ').slice(0,words).join(' ');

        if (words > 0) textContents += addon;

        wrapper.empty();



        if (image.attr('src')) {

            var imageOriginalHeight = image.height();

            var imageOriginalWidth = image.width();

            var imageParent = $(image).parent();

            wrapper.append(imageParent).append(textContents);

            if (square) {

                image.attr({src : image.attr('src').replace(/s\B\d{3,4}/,'s' + dimension + '-c')});

                image.attr('width',dimension).attr('height',dimension);

            } else {

                image.attr({src : image.attr('src').replace(/s\B\d{3,4}/,'s' + dimension)});

                image.attr('width',dimension);

                var newHeight = (imageOriginalHeight/imageOriginalWidth * dimension).toFixed(0);

                image.attr('height',newHeight);

            }

            imageParent.css('clear','none').css('float',orientation);

            

            switch (orientation) {

                case "left":

                    imageParent.css('margin-left',0).css('margin-right',margin);

                    break;

                case "right":

                    imageParent.css('margin-left',margin).css('margin-right',0);

                    break;

                default:

                    imageParent.css('margin-left',margin).css('margin-right',margin);

                    break;

            }

        } else wrapper.append(textContents);

        if (readmore) {

            var link = wrapper.parent().find('h3 a').attr('href');

            wrapper.append('<br /><a href="' + link + '">' + readmore + '</a>');

        }    

        

        wrapper.append('<hr>

');

        $('hr').css('width','100%').css('background-color','transparent').css('border-width',0);

    });

    

});

//]]></script>



</b:if>















note : code source http://www.blogxpertise.com/2012/07/tip-better-thumbnail-and-summary-script.html

Done