martes, 22 de diciembre de 2009

Como eliminar la función de leer más en las plantillas

Ya son varias las personas que me han dicho que desean eliminar la función de leer más (sumarios de las entradas), en alguna de mis plantillas,  en especial  en la plantilla Cuentos de Noche .



 Algunas personas desean eliminarla ya que la imagen de cada post adquieren una medida fija que es determinada en el script, entonces si la imagen original no es proporcional a la medida establecida en el script, la imagen luce un poco distorsionada, y es precisamente eso lo que no les gusta.



Además, partiendo de que blogger ha añadido esa función el el panel de edición de entradas, ya no es tan necesario usar este script para hacer el resumén en las entradas, a menos de que desees que tus post se vean exactamente iguales en proporción de el texto y el tamaño de la imagen.



Para lograrlo harás lo siguiente:



Paso 1.Vé a Diseño ►Edición de HTML, luego, marca la casilla de Expandir plantillas de artilugios.





Paso 2. Localiza  y Elimina el siguiente Script :



<script type='text/javascript'>var thumbnail_mode = &quot;no-float&quot; ;

summary_noimg = 700;

summary_img = 700;

img_thumb_height = 180;

img_thumb_width = 200;

</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>


Paso 3. Luego, localiza el siguiente código:



<div class='post-body entry-content'>

      <b:if cond='data:blog.pageType != &quot;item&quot;'>

<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>

<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script>

<span class='rmlink' style='float:right;padding-top:15px;'><a expr:href='data:post.url'>Leer más... </a></span>

</b:if>

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


Elimínalo y en su lugar pon el siguiente:



<div class='post-body entry-content'><data:post.body/><b:if cond='data:post.hasJumpLink'>

<div class='jump-link'>

<a expr:href='data:post.url + &quot;#more&quot;'><data:post.jumpText/></a>

</div>

</b:if>


Paso 4. Checa en vista previa, para ver que todo luzca bien, si es así, Guardas los cambios y listo!, ahora se verán las imágenes de cada post en su tamaño original, y además podrás utilizar la función de resumen en las entradas de tu panel de edición de entradas que ofrece blogger.

No hay comentarios:

Publicar un comentario