Códigos::. Hack para Leia Mais... automático
Autor: Fabio Velasco | Publicado: 2009-12-14T17:58:00-08:00

Hack para postagens resumidas com Leia mais automático ... conforme a imagem abaixo:







Realizando a instalação:&nbsp;


No Painel do Blogger, clique em Layout &gt;&gt; Editar HTML e marque "Expandir modelos de widgets".  


Encontre a tag &lt;/head&gt;  
Copie o código abaixo e cole IMEDIATAMENTE ANTES desta tag.&nbsp;  


&lt;script type='text/javascript'&gt;var thumbnail_mode = "no-float" ;

summary_noimg = 430;


summary_img = 340;


img_thumb_height = 100;


img_thumb_width = 120;

&lt;/script&gt;
&lt;script type='text/javascript'&gt;
//&lt;![CDATA[
function removeHtmlTag(strx,chop){
if(strx.indexOf("&lt;")!=-1)
{
var s = strx.split("&lt;");
for(var i=0;i&lt;s.length;i++){
if(s[i].indexOf("&gt;")!=-1){
s[i] = s[i].substring(s[i].indexOf("&gt;")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop &lt; strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' &amp;&amp; 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&gt;=1) { 
imgtag = '&lt;span style="float:left; padding:0px 10px 5px
0px;"&gt;&lt;img src="'+img[0].src+'" width="'+img_thumb_width+'px"
height="'+img_thumb_height+'px"/&gt;&lt;/span&gt;';
summ = summary_img;
}
var summary = imgtag + '&lt;div&gt;' + removeHtmlTag(div.innerHTML,summ) + '&lt;/div&gt;';
div.innerHTML = summary;
}
//]]&gt;
&lt;/script&gt;

2. Agora procure pelo trecho &lt;data:post.body/&gt; em seu template e substitua por este código abaixo:


&lt;b:if cond='data:blog.pageType != "item"'&gt;
&lt;div expr:id='"summary" + data:post.id'&gt;&lt;data:post.body/&gt;&lt;/div&gt;
&lt;script type='text/javascript'&gt;createSummaryAndThumb("summary&lt;data:post.id/&gt;");
&lt;/script&gt; &lt;span class='rmlink' style='float:right;padding-top:20px;'&gt;&lt;a expr:href='data:post.url'&gt; read more "&lt;data:post.title/&gt;"&lt;/a&gt;&lt;/span&gt;
&lt;/b:if&gt;
&lt;b:if cond='data:blog.pageType == "item"'&gt;&lt;data:post.body/&gt;&lt;/b:if&gt; 

Visualize para checar se tudo ocorreu bem então salve o modelo e pronto! 


Configurações:

1. Alinhamento da imagem: Se desejar que o resumo fique abaixo da imagem, altere esta linha:



&lt;script type='text/javascript'&gt;var thumbnail_mode = "no-float" ;&nbsp;





Retire o "no-xxxxx" do código deixando apenas "float"

2. Sumário: Altere os valores conforme suas preferências:

summary_noimg = 430; Coloque a quantidade de caracteres para os resumos sem imagem.
summary_img = 340; Coloque a quantidade de caracteres para os resumos com as imagens.
img_thumb_height = 100; Coloque a medida para a altura da imagem-thumb.
img_thumb_width = 120; Coloque a medida para a largura da imagem-thumb.

3.&nbsp; Read More / Leia Mais: Alterando o link: 


Se quiser, troque o termo “read more”, por “Leia mais”

Se não quiser que apareça o título da postagem repetido depois de
Leia mais, apague o trecho "&lt;data:post.title/&gt;", assim com as
aspas.


          
<!--
google_ad_client = "pub-3119613383745620";
/* 300x250, criado 14/12/09 */
google_ad_slot = "4860606343";
google_ad_width = 300;
google_ad_height = 250;
//-->


 

         
<!--
google_ad_client = "pub-3119613383745620";
/* 250x250, criado 14/12/09 */
google_ad_slot = "6100974323";
google_ad_width = 250;
google_ad_height = 250;
//-->