Mostrando las entradas con la etiqueta leer mas sobre. Mostrar todas las entradas
Mostrando las entradas con la etiqueta leer mas sobre. Mostrar todas las entradas

domingo, 21 de abril de 2013

Como Añadir Gadget Lea Mas Articulos Con Fotos En Blogger

Leave a Comment
Como Añadir Gadget Lea Mas Articulos
Este asombroso truco  creara un resumen de tus entradas con foto. No necesitaras anadir codigo en cada entrada que hagas o escribas.

1.Eentra en tu "Plantilla" --> "Editar HTML" de tu blog.
2.Da Click en "Plantilla de Formato"
3.Baja hasta donde dice </head> tag.
4.Añade el codigo de abajo antes de </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 : Puedes cambiar los valores a tu gusto.
summary_noimg : Numberos de caracteres mostrados cuando no hay una imagen.
summary_img :numeros de caracteres a mostrar cuando hay imagen.
img_thumb_height :altura de la foto.
img_thumb_width : anchura de la foto.


5AHORA baja a donde veas este codigo:
<data:post.body/>



6.Reemplaza el codigo de arriba por este 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.Guarda tu plantilla y esta listo.disfrutalo.
Read More