Ver parte de una entrada con una imágen y la opción "leer más"

En muchos blogs la página principal tiene las entradas resumidas con la opción "leer mas" para poder leer la entrada completa.
Para poder lograr esto es necesario hacer unos cambios en la plantilla
Aquí voy a dejar como modificar la plantilla para lograr esto y que además las entradas tengan una imágen como miniatura

1)Ir a la zona de Edición de HTML
2)Lo primero que deben hacer es descargar su plantilla, para asegurarse de que si algo no sale bien puedan volver a como están ahora
3) Luego deben asegurarse que la opción "Expandir las plantillas de artilugios" este activada
4) Localizar este código
<data:post.body/>
Si tiene dificultad para buscarlo pueden usar la opción edición buscar y escribir el código para buscar más rápido
5)Luego borramos este código y lo remplazamos por este otro:

<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:right'><a expr:href='data:post.url'> Leer más...</a></span>

</b:if>

<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>


6)Ahora pegar este código justo antes de la etiqueta
</head>


<script type='text/javascript'>

summary_noimg = 430;

summary_img = 340;

img_thumb_height = 100;

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>



Si tienen algún conocimiento de HTML pueden cambiar los tamaños del recuadro de la imágen y un para de cosas más

Si quieren ver un ejemplo entren a www.naciceleste.blogspot.com

¡Queda muy bueno!