AGREGAR BOTON "LEER MAS" PERSONALIZADO EN TU BLOG DE BLOGGER

Este truco interesante creará automáticamente resúmenes del post con imágenes en miniatura. No es necesario añadir ningún código adicional en cada post OK.

Tutorial por UNIVERSO BLOGGER :

1.Ve a "Plantilla" -> "Edición de HTML" de tu blog.

2.Haga clic en " Expandir plantillas de artilugios "

3.buscar la etiqueta  </ head> .

4.Ahora añadir a continuación el código justo antes de la etiqueta </ head> .

<script type='text/javascript'>
summary_noimg = 250;
summary_img = 200;
img_thumb_height = 150;
img_thumb_width = 150; 
</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>

Nota: Se puede cambiar por  valores como desee.

summary_noimg :. número de caracteres a mostrar cuando no hay ninguna imagen 
summary_img : número de caracteres a mostrar cuando hay una imagen.
 img_thumb_height : altura de las imagenes miniaturas 
.img_thumb_width : Ancho de las imagenes miniaturas .


5.Ahora Desplácese hacia abajo hasta que vea esto:

<data:post.body/>

6. Remplace el código de arriba con el código de abajo 

<b:if cond='data:blog.pageType != "static_page"'>
<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>
</b:if>
</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>

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

<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<div style='float:right;margin-right:10px;margin-top:5px;'>
<a expr:href='data:post.url'>Read More</a>
</div>
</b:if>
</b:if>

7. guardar la plantilla y ya está.

ESPERO LES SEA UTIL :) cualquier duda escribirme