Hack automático Leia mais para Blogger

Como você deve ter notado, eu acabei de instalar este hack aqui no blog. E isto foi feito, literalmente, em 5 minutos!

Seguindo este tutorial, que encontrei no Blogspot Blog (original em inglês), com certeza você irá conseguir fazer rapidinho, se quiser economizar espaço no blog.

Antes de fazer qualquer mudança, salve uma cópia do template no seu computador clicando em “Baixar modelo completo”.

Então, vamos à instalação:
1. No Painel do Blogger, clique em Layout > Editar HTML e marque "Expandir modelos de widgets".
Use CTRL+F para encontrar a tag </head>
Copie o código abaixo e cole IMEDIATAMENTE ANTES desta tag.

<script type='text/javascript'>var thumbnail_mode = "no-float" ; 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>

Nos trechos abaixo, você pode modificar os números, de acordo com as suas necessidades. (Eu mantive o código original!)
summary_noimg = 430; is post cut height without image
summary_img = 340; is post cut height with image
img_thumb_height = 100; is thumbnail image height
img_thumb_width = 120; is thumbnail image width
2. Agora procure pelo trecho <data:post.body/> em seu template e substitua por este código abaixo:

<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;padding-top:20px;'><a expr:href='data:post.url'> read more "<data:post.title/>"</a></span> </b:if> <b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>

Visualize o seu template e se estiver tudo certinho, clique em SALVAR.

• Detalhe: se quiser, troque o termo “read more”  que está destacado no código acima em azul, por “Leia mais”
  
• Se não quiser que apareça o título da postagem repetido depois de Leia mais, apague o trecho "<data:post.title/>”, assim com as aspas.

Posted in: Tutoriais