Junte-se a 22.515 pessoas que
decidiram aprender tudo sobre Criação de Blogs Profissionais e Redes Sociais.

Códigos e Scripts Postagens Vanessa S.

Resumo de Postagem Automático com imagens na Página Inicial

A maioria dos blog aparecem somente um resumo da postagem na página inicial, onde no final aparece escrito “Leia Mais”, ou “Continue Lendo”, e quando clicamos aparece a postagem completa.Eu uso aqui no meu blog,e particularmente acho que dá uma estética melhor á pagina inicial, evitando que a home fica extensa demais, o que causa, muitas vezes, um certo desconforto na busca dos conteúdos em certas páginas.

Hoje vou ensinar como incluir este ‘hack’ no seu blog.
Com estes recurso suas postagens se resumirão automaticamente na sua página inicial. A cada postagem, irá aparecer um breve resumo do conteúdo da postagem, juntamente com uma miniatura da imagem utilizada no post.

[becape]Antes de tudo faça um backup do seu Template para evitar transtornos, se algo sair errado.
[/becape]

Para evitar problemas na dependência com algum servidor externo, é preferível que instale o script diretamente no template.
No código a seguir, o hack “Leia Mais” não se aplicará nas Páginas Estáticas, as postagens só aparecerão resumidas na página inicial,marcadores e arquivos.

1º passo – incluir o script no template:

Acesse o painel do Blogger, entre no modo ? ‘editar html’ do seu template (não precisa clicar em ‘expandir modelo de widget’) e procure pela tag </head> e cole esse código abaixo ANTES dessa tag:

 
<!-- JavaScript Resumo do Post --> 
<script type='text/javascript'> 
var thumbnail_mode = &quot;float&quot; ; 
summary_noimg = 450; 
summary_img = 400; 
img_thumb_height = 100; 
img_thumb_width = 100; 
</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) { 
if(thumbnail_mode == "float") { 
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; 
} else { 
imgtag = '<div style="padding:5px" align="center"><img style="max-width:'+img_thumb_width+'px; max-height:'+img_thumb_height+'px;" src="'+img[0].src+'" /></div>'; 
summ = summary_img; 
}}var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>'; 
div.innerHTML = summary;} 
//]]> 
</script> 
<!-- JavaScript Resumo do Post - Fim--> 

Caso tenha dificuldades em copiar o código acima, copie o conteúdo deste arquivo.txt e cole-o ANTES da tag </head>.

Como este script mostra uma miniatura da imagem do post junto com o resumo do texto, você pode personalizar a quantidade de caracteres que aparecerão no resumo e o tamanho da miniatura da imagem do post, desta forma:
Em summary_noimg ? é aqui que você vai indicar a quantidade de caracteres para os resumos se o texto não contiver imagem.
summary_img ? Indique o número de caracteres do resumo para o texto que contiver imagens.

É neste trecho que você vai definir o tamanho que você quer que as imagens do resumo tenham:
img_thumb_height ? Indique a altura da imagem
img_thumb_width ? Indique a largura da imagem

Visualize e Salve!
Agora vamos a 2ª etapa.

2º passo – edição no html:

Volte no menu “modelo” ? “Editar html”, clique em ‘expandir modelos de widgets’ e procure por:

 
<div class='post-body entry-content'> 
<data:post.body/> 
<div style='clear: both;'/> <!-- clear for photos floats --> 
</div> 
 

Apague tudo e substitua por:

 
<div class='post-body entry-content'> 
<b:if cond='data:blog.pageType != &quot;item&quot;'> 
<b:if cond='data:blog.pageType != &quot;static_page&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 id='showlink'><a expr:href='data:post.url'>Leia Mais &#9658;</a></span> 
</b:if></b:if> 
<b:if cond='data:blog.pageType == &quot;item&quot;'> 
<data:post.body/></b:if> 
<b:if cond='data:blog.pageType == &quot;static_page&quot;'><data:post.body/> 
</b:if> 
<div style='clear: both;'/> <!-- clear for photos floats --> 
</div> 
 

A palavra “Leia Mais” se refere ao texto do link que aparecerá no post, na sua página inicial, é onde o leitor ao clicar,e direcionado à página do post completo. É neste espaço que você coloca o texto que preferir (Ex.Continue Lendo,Ler Todo Artigo, Leia Mais, Ver Conteudo etc).

Você pode também personalizar o link “leia mais”, de diversas maneiras,substituindo o texto por uma imagem, ou acrescentar uma imagem ao texto do link, com uma seta, por exemplo.
Veja como proceder logo abaixo:

3º passo – Personalizando o Link ‘Leia Mais’:

Para substituir o texto por uma imagem, acesse o menu “modelo”, entre em “editar html” do seu template e procure por este trecho:

 
<span id='showlink'><a expr:href='data:post.url'>Leia Mais ? 
 

E substitua o texto ‘Leia Mais’ por:

 
<span id='showlink'><a expr:href='data:post.url'> 
<img src="URL-DA-SUA-IMAGEM" /> 
 

Para incluir uma imagem ao texto ‘Leia Mais’, acrescente logo em seguida a ele:

 
<img src='ENDEREÇO-DA-SUA-IMAGEM'/> 

4º passo – aplicar estilos CSS:

Se você quiser, poderá também personalizar estilos para o link ‘Leia Mais’, para isto, basta incluir o seguinte código logo ACIMA da tag ]]></b:skin> :

 
#showlink { 
font-size: 11px; /* escolha o tamanho da fonte para o link */ 
float: right; /* escolha se quer link flutuando à esquerda ou direita */ 
margin-right: 30px; /* aplique margens para posicionar link */ 
margin-top: -8px; /*a margem negativa para o topo aproxima o link do texto do post */ 
font-weight: bold; 
} 
 
#showlink a { 
color: #ffffff; /* escolha a cor de seu link */ 
} 
 
#showlink a:visited { 
color: #cccccc; /* escolha a cor de seu link quando visitado */ 
} 
 
#showlink a:hover { 
color: #000000; /* escolha a cor de seu link quando passa o mouse em cima */ 
} 
 

Confira o artigo:Criando estilos para o Hack ‘Leia Mais’ de postagem resumida e veja como aplicar estilos para os resumos e como personalizar os posts apenas na página inicial.

Sobre o autor | Website

Fundadora do Mundo Blogger. Autodidata que adora internet, que se encantou com blogs, seus códigos e templates, desde 2009, e por conta disso começou a "brincar" com web design nas horas vagas, até que resolveu criar o Mundo Blogger para compartilhar o que aprendeu com você através dos tutoriais publicados aqui.

Desculpe, os comentários deste artigo estão encerrados.

106 Comentários

  1. Marcos disse:

    Muito bom, tentei outros mas nenhum tão prático e fácil quanto esse. Muito obrigado. só que eu queria que os posts ficassem ‘justificados’, pois eles aparecem meio ‘desorientados’, se é que você me entende. É possível?

    Obrigado!

  2. Douglas disse:

    tem como aparecer a imagem de um vídeo? O que deve ser modificado? Obrigado

  3. José disse:

    Oi
    Tem como tirar a miniatura da postagem completa?
    Fazer ela aparecer só no resumo.

    Obrigado, tá me ajudando muito seu post.

    • Vanessa disse:

      Por este tutorial aparece miniatura somente no resumo. Se no seu blog está aparecendo de forma diferente, lamento, mas ou vc fez algo errado ou pode ser algum problema relacionado ao seu template. Não tenho como te ajudar.

  4. Mario disse:

    Oi, tenho outra pergunta.

    No resumo, tem como deixar uma imagem diferente da imagem que tiver na postagem?

    Obrigado. 🙂

  5. Mario disse:

    Olá!
    Na parte do código:
    summary_img = 184;
    Eu determinei que aparecessem apenas 184 caracteres, mas não aparece essa quantia, aparece aquelas “reticências” e o texto resumido.

    Teria como aparecer a quantia exata de caracteres do resumo da postagem sem as reticências (…)?

    Obrigado. 🙂

  6. TheBiel73 disse:

    Mundo Blogger
    Dicas Blogger
    Dicas para Blogs

    OS MELHORES SITES (estão na ordem certa) PRA SE PEGAR COISAS PARA BLOGS!

  7. Marcelo disse:

    Ótimo post, fiz em um blog de teste, deu certinho, vou usar no meu próximo blog…

    Parabéns…

  8. Reinaldo disse:

    Ola, eu gostaria de saber, se dá pra por só o leia mais o titulo e a imagem, é por que eu sei tirar o otexto só que fica o começo dele(a primeira palavra) teria como tirar ele?

    Espero respostas, obrigado.

  9. Oi. sua informação ajudou bastante. Gostaria de agradecer por isso. Mas também só está aparecendo duas postagem por página e gostaria que que pudesse aparecer pelo menos cinco postagens.

    Onde posso modificar isto?

    Obrigado

  10. ploc disse:

    Olá de novo. Eu baixei um template que já vem com esse recurso. Aoenas mudei o que estava escrito em Inglês: Read More por Leia Mais.
    A minha questão é que observo que as imagens que aparecem em cada postagem enquanto está como resumo ficam distorcidas, feias. E só ficam boas quando abre a postagem completa para ler. Já vi esse mesmo problema em outros blogs que usam esse recurso.
    Há uma solução para isso?
    Obrigado.

    • Vanessa disse:

      Existem diversos hacks diferentes para resumo automático. O mais conhecido e mais utilizado é este que está no tutorial. Não tenho como te ajudar,pois não há como eu saber o que ocorre com o seu. Sugiro que vc procure o desenvolvedor do template que vc está usando.

  11. samuel ambrosio disse:

    Olá Vanessa, boa tarde!

    Eu tinha feito meu próprio hack, mas ele apresentou problemas. Eu vi aqui o teu post e alguns códigos teus me abriram os olhos para meu erro. Muito obrigado! Seu blog é fantástico, parabéns!

  12. Hemerson disse:

    Muito obrigado, ajudou bastante, vejam como ficou

  13. Jéssica disse:

    Ahh Muitoo obrigado mesmo!!!! Parabens Pelo Seu Trabalho Incrivel!! =)

  14. Valdiney disse:

    Parabens pelo o post!!
    O seu trabalho é surpreendente!!

  15. Lucas disse:

    Eu tô tentando colocar no meu blog que eu tô testando o , template e nenhum dos leia mais funcionou, nem o do Blogger, não sei, mas deve ser o template… Pode me ajudar?

    • Vanessa disse:

      @Lucas:
      Alguns recursos podem variar de template para template. Lamento, mas eu não tenho como te ajudar, pois deve ser algo relacionado ao seu template e para tentar descobrir, teria que ser feita uma análise mais minuciosa, e infelizmente eu não disponho de tempo para isso. De qualquer forma, agradeço pelo comentário.

  16. Alvaro disse:

    O unico tutorial que de fato me ajudou obrigado

  17. Sergio-F disse:

    Para quem não achou o "div class='post-body entry-content'"
    procure por div class='post-body entry-content', porwue as vezes no template tem mais alguma coisa.

    Para alinhar o Leia-mais a direita eu fiz assim e deu certo:
    Procure por "Leia-mais" (ou o nome que estiver usando)
    Verá mais ou menos isso:

    Leia Mais ?
    *sem asterisco
    Coloque <*p align='right'> antes e depois.
    ficaria assim:
    *sem asterisco
    <*p align='right'>Leia Mais ?

  18. Filipe Silva ivo disse:

    Obrigado conseguir resumir

  19. Rodrigo Anjos disse:

    gostaria de fazer o contrario, transformar o resumido em full post,
    algum tuturial?

  20. Andson Boa Sorte disse:

    como sempre muito bom.

  21. bcommv disse:

    olá!!
    gostaria de saber se você pretende criar um tutorial dese a instalação do js até o resumo automático para blogs que possuem domínio próprio.
    SEU BLOG É MUITO BOM E RECOMENDO PARA TODOS MEUS AMIGOS BLOGUEIROS VLW!!!

  22. looney catt disse:

    Ajudou bem;

  23. Dani Fuller disse:

    Procurei por aqui e as dúvidas do pessoal, mas não vi necessariamente sobre isso. Primeiro obrigada pela dica e tudo o mais do seu blog. É tão útil e um dos melhores existentes. Segundo é sobre o alinhamento do texto. Tudo que tem ai no código só consegui fazer mudar o alinhamento da imagem do 'leia mais', mas do texto em si não.. eu gostaria muito que ele ficasse como 'justificado', mas não está dando muito certo.

    Obrigada mesmo assim.
    bjs

  24. Ju Monteiro disse:

    Grata Clau!
    Até mais!

  25. .:: Clau ::. disse:

    Pandora
    A informação já está incluida no próprio artigo que vc citou: "Assinatura do autor do Post Personalizada com imagem".

  26. Pandora disse:

    Oi Clau.
    Mais uma vez muito grata pelas suas dicas. São super valiosas pra quem está começando e seus blog são lindos. Segui seu post pra incluir assinatura com imagem ao final do post e deu tudo certo. Tb inclui o linkwith. Só que agora tenho duas dúvidas: na página inicial a assinatura fica aparecendo e eu queria que aparecesse somente na página do post completo… tem como fazer isso? A segunda é que assinatura está ficando abaixo das caixinhas do linkwith e eu gostaria que elas ficassem logo no fim do post, acima do linkwithin… tem como? Abraços

  27. .:: Clau ::. disse:

    Rafael Silva
    Vou ver se preparo um tutorial depois.

    Thyego
    Olha se tem, eu não sei te informar, mas no meu outro blog, o Universo Sombrio, eu costumo publicar videos, e lá tb uso este hack leia mais. O que eu faço lá é colocar uma imagem no inicio do post e sempre incluo um pequeno textinho de introdução no post, assim, na página inicial vai ter sempre uma imagem e um trechinho em texto, para que não fique aparecendo só aquele monte de código do video, entendeu? Eu faço assim, se quiser, faz um teste para ver.

  28. Thyego Ferraz disse:

    Oi, tenho este código em meu template porém percebi que quando posto um vídeo ele não aparece na pagina inicial (nem como miniatura e nem no tamanho normal), fica apenas o titulo e o texto (quando tem texto na postagem) e o link Leia Mais.
    Minha duvida é a seguinte, tem como fazer aparecer a miniatura do vídeo ou o vídeo normal (como se não existisse o código)?
    Grato.

  29. Rafael Silva disse:

    Olá Clau,

    Como colocar o hack, Leia Mais.
    E aqueles elementos, marcador e postado por.
    lado à lado.

    Muito Obrigado.

  30. .:: Clau ::. disse:

    Humberto
    Vc tem que incluir o "text-align"…dá uma lida no post: "A propriedade CSS Text", pode ser que te ajude.

  31. Humberto "Jones Cray" disse:

    Olá Clau, E como se faz para alinhar o texto das postagens resumidas pelo hack?

  32. TábZombie disse:

    Obrigada!
    Ficou muito mais bonito do que com o botão de expansão de postagem, sem falar que é mais prático pois não tem que apertar nada quando se escreve o post.
    Pena que aparece miniatura dos vídeos na página inicial.

    Beijos

  33. Luiz Guilherme disse:

    Simplismentre Perfect mto bom os sites mais famozos por esses códicos ( códicos blogger-Ferramentas blogs entre outros)ficaram para trás você é 10 valeu

  34. Lu_Guii disse:

    valeu msm

  35. Sandro3a disse:

    Olá clau coloquei esse hack leia mais automático com imagem no meu blog minha pergunta é se tem como eu estipular o texto que aparece na pagina inicial. Eu coloquei um hack leia mais que me dava essa opção de estipular o texto que iria aparecer na pagina inicial colocando esse codigo span id="fullpost /span no meu post mas ele nao tem imagem queria colocar o resumo e a imagem. Obrigado pela a atenção até

  36. João Neto disse:

    O meu blog não tem a TAG:

    class='post-body entry-content'>

    style='clear: both;'/>

  37. Arranque na Web disse:

    Olha, cada vez mais eu me surpreendo com esse blog!! Eu fiquei procurando um tempão por uma explicação dessa, mas eu não conseguia achar uma que funciona-se. Mas de repente, eu estava no google, e achei esse blog lá quando fiz a busca.

    Resultado: Em menos de 3 minutos ja estava com os posts com imagens e resumo automático.

    Muito Obrigado por essa esxplicação!

  38. Testei... e você??? disse:

    Visitando os blogs dos colegas acima tb reparei o mesmo problema, só funciona na Página Inicial.

    Abs

  39. Testei... e você??? disse:

    Oi Clau…

    No meu funcionou, porém somente na página inicial mesmo, qdo clico nas próximas páginas, não faz mais o efeito, fiz o teste no mínima e o mesmo aconteceu… Acho que é pelo novo sistema do blog.

    Abs

  40. Jr Marques disse:

    Oi Clau, comecei um Blog à poucos dias, nunca havia trabalhado com isto mas como sou novo neste setor de 'marketing' em minha empresa (que também iniciou o setor comigo) decidi divulgár a empresa. Há uma semana comecei à trabalhar em um blog http://emnemergencias.blogspot.com e acredito estar ficando um bom trabalho.
    Sobre este post, segui todas as regras e deu tudo certo mas todas as postagens ficaram com as informações 'leia mais' mesmo não necessitando e percebi que para resumir os textos é preciso utilizar o 'jump break'. Ao utiliza-lo em um post, apareciam os links 'mais informações' e 'leia mais'. Editei o html então e apaguei o nome 'leia mais' permanecendo então o 'mais informações'. Existe a possibilidade na opção de edição do html de modificar o nome 'mais informações'?
    Antes de qualquer coisa, muito obrigado pelos seus post, tem-me ajudado muito.
    Gostaria também da sua opinião (se possível).
    Obrigado!!!!

  41. Jerfferson Araújo disse:

    Olá,

    tenho uma dúvida simples. Os meus posts na página inicial estão com uma fonte que eu considero meio suja para o template, e quero modificá-la, mas não sei como.

    Alguém poderia me dar uma luz?

  42. Coca Cola disse:

    Demorou mais consegui ^^

  43. ????a disse:

    em primeiro valeu fucionou certinho aqui 😀
    tem como deixar a imagem em seu tamanho original
    porque tem posts que tem imagem de altura e largura diferentes e por isso ela fica meio distorcida.

    então e isso tem como deixa a imagem com sua altura e largura original?

  44. .:: Clau ::. disse:

    Zaraki, Duuh
    Valeu 😉

    testeievoce
    Deve ser sim.

    thamiires
    O seu blog deve estar configurado bordas nas imagens da area do post.
    Vc tem 2 opções: ou verifica isso nos trechos:
    .post img
    .post-body img
    se estiver estipulado bordas, vc retira.
    ou então no código que vc usou para incluir a sua imagem, acrescente um "style", desta forma:
    img style='border:none;' src='ENDEREÇO-DA-SUA-IMAGEM'/

  45. thamiires disse:

    Oi Clau, ao inves de colocar um texto, eu optei por imagem. Entretanto, aparecem bordas na imagens e eu ja tentei de TUDO pra retira-las e nao consegui =/

  46. testeievoce disse:

    Fiz tudo certinho e esta funcionando bem, porém qdo eu clico para ir para postagens antigas, aparece os marcadores e desaparece as bordas os resumos, será meu templates???

    Abs

  47. Duuh Tankian disse:

    fiz deu td certo mas ficou meio estranho o postagem na pagina inicial

  48. Zaraki disse:

    nossa mais uma vés você superou todo mundo em , passei aqui pra diser que deu certo no meu blog e queria te agradecer ok, você e a melhor , sempre sigo suas dicas porque sempre dão certo, abraço.

  49. .:: Clau ::. disse:

    RvPokedex
    Lamento mas não tenho como te ajudar.

  50. Roneide Sousa disse:

    Opa MUiiiiiiiiiiiiitOOoo Obg tava ficando loka aqe tentando tirar o Leia Mais das Páginas estáticas…poxa….vlw

    uhu \o/

  51. RvPokedex disse:

    Olá, aprecio muito seu blog e o modo com que informa as pessoas de HTML que levam muito tempo para aprender, eu por exemplo, quase nunca fui ensinado.
    Tenho um pequeno problema, talvez 3! O meu Leia Mais é muito bom, mas quero colocar só a foto e em seguida o título, poderia me ajudar?
    E também preciso retirar a barra lateral, assim, para as postagens ocuparem a tela inteira.
    E como muda o tamanho ou retira uma postagem principal??? Aquela que fica de outra cor, maior e é a última a ser postada vira ela.
    Favor ajude.

  52. Andreonni disse:

    Muito obrigado pela dica, procurei muito sobre isso..pro resolvido http://universidicas.blogspot.com/

  53. .:: Clau ::. disse:

    Jean Corauci
    A única coisa q posso te recomendar é vc dê uma lida neste artigo:

    https://www.mundoblogger.com.br/2010/08/aplicar-estilos-pagina-inicial-do-blog.html

    pode ser que ajude.

  54. Jean Corauci disse:

    Ola, muito bom este hack, já estou utilizando, mas gostaria de saber se é possível deixar as postagens lado a lado, consegui diminuir a largura da postagem, mas deixar lado a lado as postagens não, você poderia me ajudar por favor?

  55. AntonioAlves disse:

    Clau, adorei seu blog, sou iniciante, e já estou te seguindo.
    A unica coisa que eu não consegui fazer foi aumentar a miniatura, quando aumento os numero no local da imagem continuam sempre do mesmo tamanho. E quando usava outro layout padrão ela aparecia grande.
    O que posso fazer Clau?

  56. .:: Clau ::. disse:

    Rafael Snatos Almeida
    Fui até o seu blog e verifiquei que vc PLAGIOU vários artigos meus no seu blog.
    Peço que vc exclua os posts plagiados, caso contrário, terei que tomar providências cabíveis. Se vc não sabe: plágio é crime!
    E antes que me pergunte: eu não autorizo cópias dos artigos publicados no meu blog, portanto, não adianta incluir os créditos nos seus posts. Existe um aviso sobre isso ao final de todas as postagens e todas as minhas publicações possuem licenças. Verifique a licença!

  57. .:: Clau ::. disse:

    Rafael
    Não há como eu saber especificamente o q aconteceu no seu template, mas provavelmente o problema está no seu template. Não tenho como ajudar.

    link
    É isso mesmo. Em alguns templates não funcionam determinados recursos, só não me pergunte o pq…rs

  58. link disse:

    Adorei?! como sempre, seu blog quebrando galhos aqui!!! mas aí, em alguns templates meus, não pegou snif! T.T, é aquela mesma coisa q vc sempre diz "professora"? rsrs, de q em alguns templates ñ pegam, é isso? sensei?

  59. Rafael Snatos Almeida disse:

    Meu ploblema e o seguinte o "leia mais" Fucionou corretamente mas quando clico nele abre ujma nova pagina com o titulo do poste e o resto mas a materia do poste nao aparece

  60. Tayls? F?li??™ disse:

    Na Opção 2º passo – edição no html: esta faltando <*/br>

  61. Lukas disse:

    E se meu template não possui o còdigo da 2° etapa?

  62. Lúh Galativicis disse:

    Olá, nossa amei suas dicas e ja fiz no meu blog e deu certo, obrigada.
    Luh
    http://www.sempre-belas.blogspot.com

  63. .:: Clau ::. disse:

    Guilherme
    Notei que na hora q eu publiquei o código, acabou que uma "div" ficou faltando. Já corrigi. Tenta instalar o 2º passo novamente.

  64. Guilherme Turatti Fonseca disse:

    olá Clau, fiz a primeira parte e salve.
    apos ao fazer a 2º parte apareceu a seguinte mensagem
    "Não foi possível analisar o seu modelo, pois sua formatação é inadequada. Certifique-se de que todos os elementos XML estão fechados adequadamente.
    Mensagem de erro em XML: The element type "div" must be terminated by the matching end-tag "

    Obs: fiz este hack no meu outro blog e funcionou.

    Por favor se souber a solução mande um email para mim malito:gui.turattifonseca@gmail.com

    Até então muito obrigado, e parabéns pelo blog.

  65. Edu Aurrai disse:

    Valeu pelo post!

  66. .:: Clau ::. disse:

    -=|G¡äñ|=-
    Obrigada pelo comentário e fico feliz q tenha dado tudo certo ai no seu blog 😉

  67. -=|G¡äñ|=- disse:

    Clau, Clau, Clau

    seu blog para mim é o melhor no Brasil!!!

    Excelente!!! todas suas dicas funcionam no meu blog. XD

  68. .:: Clau ::. disse:

    Paula
    No meu eu consegui fazer com que a imagem não apareça na home. O que fiz foi estipular um valor "0" nas imagens, desta forma:
    img_thumb_height = 0;
    img_thumb_width = 0;
    Faz um teste e vê se dá certo no seu template, no meu deu!

  69. Paula disse:

    Oi, funcinou, mas eu queria só o leia mais, sem a miniatura da imagem ao lado. O que eu tenho que tirar?

  70. Turse disse:

    Olá.

    Comigo funcionou depois de fechar mais uma div do código do passo 2. agradeço muito a ajuda, muito bom seu blog. vlw.

  71. ::Clau:: disse:

    Bre:
    Tá vendo só? Era só questão de refazer. Q bom q conseguiu 😉

  72. ::Clau:: disse:

    gilvancn:
    O código js está disponivel no post, é só vc copiar num bloco de notas e salvar no seu pc e depois hospedar. Desculpe mas eu não envio códigos por email. 🙂

  73. Bre disse:

    Obrigada por responder, terminei consultando no mesmo tutorial do blogger e encontrei o código que me faltava.
    Ao invés de colocar o código entre a tag eu o substituía.

  74. gilvancn disse:

    Ola Clau, estou eu aqui de novo pra te agradecer pelas dicas e te fazer um pedido: Tem como vc me enviar por e-mail (baixedicasdahora@hotmail.com) o codigo js pra mim hospedar no meu servidor? Se possivel eu agradeço de coração, um abraço.

  75. ::Clau:: disse:

    Bre:
    Não há como eu saber especificamente o q aconteceu no seu template. Não tenho como ajudar.

  76. Bre disse:

    Olá Clau,
    Já coloquei e tirei e auterei os códigos umas 3 vezes e voltei a deixar sem nada. O jumper funciona, mas não aparece o "leia mais" para ser clicado.
    Alguma solução pra isso?
    Agradeço desde já.

  77. Marcos Danilo disse:

    Removi a primeira parte ele fica mais organizado

    http://turboperfeito.blogspot.com/

  78. Marcos Danilo disse:

    como faiz pa colocar a imagem? n ta funcionando desse geito aew

  79. ::Clau:: disse:

    Alysson Nathan Girotto:
    Segue o tutorial para do artigo:Criando estilos para o Hack 'Leia Mais' de postagem resumida que está no tutorial acima, e inclua o código referente ás imagens dos post e atribua o "float:center;" a ele.

  80. Alysson Nathan Girotto disse:

    Não consegui Clau =/, mas tem um modo de centralizar as imagens?

  81. ::Clau:: disse:

    @Alysson Nathan Girotto:
    Q eu saiba o script exige q tenha texto, mas vc pode tentar editar o código javascript e tentar descobrir se isso é possível ou não..se conseguir, volte aqui pra contar para gente 😉
    Boa sorte.

  82. Alysson Nathan Girotto disse:

    Clau, como faço para colocar apenas a imagem, sem nenhum texto, eu tentei arrumar aqui mas ele "exige" um texto, caso eu coloco 0 ele mostra toda a postagem. Tem como me ajudar?

  83. ::Clau:: disse:

    @gilvancn:
    Dá uma lida neste tutorial:
    Ocultar Elementos/Widgets em Página Específica.

  84. gilvancn disse:

    Caraca na minha frente e não vi, brigadão Clau, só mais uma perguntinha: Eu uso o mostrar arquivos relacionados do LinkWithin, vc saberia me dizer se tem como mostrar o mesmo só nos posts e não na home? Muito obg pela ajuda, vlw…

  85. ::Clau:: disse:

    @gilvancn:
    No 4º passo que vc deve aplicar a flutuação do seu link.
    Direita = float:right;
    esquerda = float:left;

  86. gilvancn disse:

    Ola Clau,
    Desde ja agradeço pelos posts tem me ajudado muito no meu blog, gostaria de fazer uma perguntinha: Como faço para deixar o "leia mais" alinhado a direita? Tem implementar o align="right" mais não encontrei o cnto certo para faze isso, me ajuda aí Clau, brigadão.

  87. Ronaldo disse:

    Eu não consegui colocar essa função! =/ Talvez seja pq eu não sei nada de html…

  88. Bruno Sajermann disse:

    Obrigado Clau, mais uma vez parabéns, suas postagens ajudam muito!

    Bjo

  89. .:: Clau ::. disse:

    @BRUNO SAJERMANN:
    Não. Esse hack funciona a base de um script e ele se aplica a todas as postagens. A unica solução seria vc retirar o hack e usar o recurso de postagens resumidas do próprio blogger.

  90. Bruno Sajermann disse:

    Alguma solução pra mim na pergunta acima?

    Obrigado!

  91. Bruno Sajermann disse:

    Olá, tem como eu desativar esse resumo em apenas uma postagem? ou em postagens que eu queira?

    Por exemplo, eu estava com problemas para aparecer minhas postagens na pagina inicial, nunca que aparecia certo, ou aparecia 3 ou 1 postagem, decidi deixar uma postagem só de "Bem vindo", porem ta com esse resumo, tem como eu retirar dessa postagem?

    Grato!

  92. ::Clau:: disse:

    @Ajasta Gayatri:
    Obrigada pela visita e pelo comentário.

  93. Ajasta Gayatri disse:

    Muito Obrigada eu, valeu !
    bjs

  94. Tavão disse:

    Muito Bom o blog \0

  95. ::Clau:: disse:

    @Paola – Essential Makeup
    Tente reverter, habilitando o recurso do próprio blogger:
    Ativar o 'Leia Mais' do Blogger.

  96. ::Clau:: disse:

    @Claudio Sanches:
    Já existe um artigo que explica como resolver o seu problema. Leia: Como retirar o hack 'leia mais' das páginas estáticas

  97. Paola - Rock Glamour disse:

    Olá, estou montando e o template que peguei veio com esse hack "Leia mais", porém fiz o processo inverso pra tirar ele, mas agora o link "Postagens mais antigas" está fora do lugar, se perceber no meu blog ele está por trás da caixa de busca, dá pra ver só o começo dele. Você tem alguma idéia do que possa fazer pra ele ficar no lugar correto? Aqui está o html atual do blog:
    http://www.4shared.com/file/241090890/aef0558/Atualessential.html
    Obrigada, Paola.
    essential-makeup.blogspot.com

  98. ::Clau:: disse:

    @Claudio Sanches:
    Eu acredito que seja pq esse script resume TODAs as postagens automaticamente, e mesmo sendo em páginas estáticas, o código interpreta como uma postagem normal, afinal, nao deixa de ser uma postagem.
    Infelizemnte não tem como eu te dar um auxilio.

  99. Claudio Sanches disse:

    Oi tive um problema bem chato com esse resumo.
    Acontece o seguinte, ele funcionou perfeitamente em tudo no blog menos nas paginas estáticas que são agora padrões do blog saca, que tem aquele url com blogspotcom/p/nome da pagina.
    Essa paginas ficam resumidas e não tem encontrei nada que faça elas ficarem como elas deverião ser.

  100. Natinho Brito disse:

    Valew mesmo muito bom o tutorial!
    consegui obrigadão!

  101. Ruiva disse:

    Obrigada, finalmente consegui resumir!

Por gentileza, se deseja alterar o arquivo do rodapé,
entre em contato com o suporte.