Fazer Resumo da Postagem com Miniaturas das Imagens

Que tal mostrar apenas os resumos das postagens no blog com uma miniatura da imagem somente alterando algumas linhas de html no seu blogger e sem usar nenhum código javascript. Isso é muito bom e certamente é bem mais fácil de fazer que as versões anteriores para fazer resumo das postagens:

Postagem expansível com miniatura da imagem
Mostrar resumo da postagem

O procedimento é bem simples, você entra na pagina editar html, marque a opção para expandir modelos de widgets e procura por post.body (use o ctrl F para pesquisar), deve estar deste jeito no seu blog: <data:post.body />

Então apague essa linha e coloque isso no lugar:
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<data:post.body/>
<b:else/>
<b:if cond='data:post.hasJumpLink'>
<data:post.body/>
<b:else/>
<b:if cond='data:post.snippet'>
<b:if cond='data:post.thumbnailUrl'>
<div class='Image thumb'>
<img expr:src='data:post.thumbnailUrl'/>
</div>
</b:if>
<data:post.snippet/>
<div class='jump-link'>
<a expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><data:post.jumpText/></a>
</div>
<b:else/>
<data:post.body/>
</b:if>
</b:if>
</b:if>
</b:if>

Cuidado para não mostrar duas vezes a mesma coisa no seu blog! Veja se logo após esse trecho se tem o código:
<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><data:post.jumpText/></a>
</div>
</b:if>

Se encontrar apague, pois isso fará que o link para ler a postagem completa apareça duas vezes como na imagem abaixo, mas se retirar esse código não terá problemas.

blog duplicado - resumo post
E já está pronto, agora é só visualizar seu blog e verá que na pagina inicial ou paginas dos marcadores do blog aparecem um trecho do seu texto e uma miniatura das imagens.

resumo da postagem no blogger
Essas imagens foram feitas durante nossos testes em nosso outro blog Sites úteis e interessantes.

Para melhorar o layout podemos adicionar algumas linhas de código CSS e deixar a miniatura da imagem ao lado do texto, volte na pagina editar HTML e coloque esse trecho antes de linha </b:skin> (caso tenha duvidas veja aqui: Onde colocar os códigos no blog):

.thumb img {float: left;margin: 5px;}

A parte float:left é o lado que a imagem ficará caso queira do lado direito então use float: right

E se quiser personalizar o link leia mais, adicione essas linhas no mesmo local que colocou o outro código CSS:
.jump-link {text-align: center;margin:auto}
.jump-link a{font-size:16pt;color:#f00}
.jump-link a:hover{color:#00f}

Veja aqui como formatar texto ou colocar bordas. Veja como ficou depois de feitas essas alterações no layout.

Encontramos e fizemos algumas modificações no tutorial publicado no site Blogger Buster, o nome original é Easy Post Summaries and Thumbnails for Blogger Blogs - No JavaScript Required!
Related Posts with Thumbnails

Link desta Pagina

Compartilhe essa Página

215 comentários:

  1. nossa achei muito simples de fazer.... bem melhor que os códigos antigos

    ResponderExcluir
  2. Huuum... Isso não é tipo aquele negócio q agente faz pondo em desing, clicando em "postagens" e coloca o q agente qusser lá? Q dizer tipo o q eu uso: "Leia mais".
    É q naum sei se esse q eu falei ou outro...

    ResponderExcluir
  3. Beatriz
    o resultado é o mesmo, essa é apenas uma maneira mais fácil de fazer e deve deixar o blog um pouco mais rapido já que não usa javascript...

    mas se já tem isso no seu blog não precisa trocar o funcionamento é igual

    ResponderExcluir
  4. Fabiano os anúncios voltarão a aparecer e a pesquisar está normal eu tinha tomado uma punição mas já arrumei o que eu fiz, e está tudo normal.

    Obrigado.

    ResponderExcluir
  5. Vlw Fabiano! Agora entendi, é eu já tenho no meu.
    De qualquer forma, obrigada.

    ResponderExcluir
  6. Fabiano, é excelente essa dica, mas eu faço uso das páginas estáticas no meu blog... e quando coloquei esse código... o Leia Mais nessas páginas não funcionaram.

    Você sabe o por quê disso?

    Se puder me ajudar...ficarei grato.

    Abraço

    ResponderExcluir
  7. acabei de fazer a correção no código... tente agora e funcionará normalmente nas paginas estáticas também.

    ResponderExcluir
  8. Olá Fabiano, me desculpe mas depois que você fez essa correção para funcionar nas páginas estáticas...tentei colocar o código e não funcionou de jeito nenhum.

    Estive pensando...sua dica ficará mais show ainda, se não pegasse essas 'páginas estáticas' - pense nisso ai, blz?

    Se você puder dar uma olhada ficarei muito grato novamente.

    Valeu

    ResponderExcluir
  9. Oh Fabiano, me desculpe outra vez... consegui aqui, não estava funcionando porque eu havia colocado o "Leia mais" do próprio editor de texto. Retirei e assim o código funcionou perfeitamente e também não esta pegando as páginas estáticas.

    Muito bom...Valeu mesmo.

    Grande abraço!

    ResponderExcluir
  10. Jorge Madaleno
    tudo bem... mexer com códigos é mesmo um problema principalmente porque sempre que alteramos vai sobrando algum resto do código anterior... alias estou pensando em fazer uma postagem sobre isso "os códigos que vão sobrando no blog"

    ResponderExcluir
  11. Fabiano me ajuda ;/
    nao tem nd haver com o titulo da postagem....
    estava mechendo no html do blog e ta dando uma coisa errada...se vc entrar em meu blog vai ver q embaixo das postagens aparece um quadrado,nao sei de onde sugui aquilo..e dentro das postagens os artigos relacionados está em cima do contador de comentario....ve se consegue achar oq fiz de errado..por favor...abraços

    ResponderExcluir
  12. está aparencendo um anuncio no local que falou... acho que já resolveu o problema...

    ResponderExcluir
  13. Fabiano tenho uma pergunta:

    Todo template quando se entra no blogger e abre o blog em cada gadget aparece uma imagem com duas cheves ou seja para editar o gadget direto do blog.

    A pergunta é a seguinte No meu blog quando clico nessa chavinha mostra a seguinte frase:

    Página não encontrada
    Desculpe, a página que você está procurando no blog Ki Completo não existe.

    Qual codigo preciso colocar para ter como editar direto do blog?

    ResponderExcluir
  14. veja se colocou os código corretamente... nos testes que fizemos funcionou perfeitamente

    ResponderExcluir
  15. Oi Fabiano, tudo bem?
    Gosto muito do seu blog, sempre tir alguma idéia para o meu.
    Tenho vontade de ter em meu blog um menu que tem submenus, já tentei várias vezes mais não consegui porque não sei mexer em html, você pode me ajudar?
    Se não for pedir muito queria também que minhas postagens aparecessem dentro de uma janela, igual essa aqui dos comentários, se puder contar com sua ajuda vou ficar muito feliz. Um abraço.
    http://susablogarteecultura.blogspot.com/

    ResponderExcluir
  16. Susie
    veja aqui Como Colocar Submenu no Blog

    sobre nossos comentarios entre em configurações > comentários

    lá tem a opção de como aparecem os comentarios do blog escolha a opção abaixo da postagem

    ResponderExcluir
  17. é rapa..resolvi sim..graças a Deus :)..abraçoss

    ResponderExcluir
  18. Excelente dica, coloque no meu blog destinado a teste e deu tudo certo. Tenho apenas uma pergunta a fazer, como devo proceder para deixar mais extenso o texto. Agradeço desde já a resposta.

    33catolico / Ricardo

    ResponderExcluir
  19. Saudações! Como edito o número de caracteres visíveis antes do resumo automático?

    ResponderExcluir
  20. Muito bom , mais uma opção eficiente .

    ResponderExcluir
  21. Este comentário foi removido pelo autor.

    ResponderExcluir
  22. MetalEmPortugues .com
    sim o numero de caracteres é automatico

    Juan(Dono da TFX)
    vou fazer alguns testes e se for possivel publicar um tutorial sobre esse assunto.

    ResponderExcluir
  23. oi tudo bem eu criei um blog mais eu queria colocar este layout
    http://btemplates.com/2011/blogger-template-game-madness/demo

    oque eu queria fazer eu queria este layout mais sem este negocio de READ MORE SABE queria um com postagem inteira sem este negocio como eu faço isso obrigado

    ResponderExcluir
  24. Felipe Arce
    tem que olhar o html do template e tentar retirar o código que faz o resumo, ou seja usar esse tutorial ao contrario.

    ResponderExcluir
  25. no meu blog eu fui botar isso aiquando eu botei visualizar em vez de ter continuar lendo tava contiar lendo kkkkkk'''

    ResponderExcluir
  26. Ola fabiano eu não consegui achar poderia dar uma dica onde eu acho isso não conseguimesmo onde achar onde fica a parte para alterar no html. poderia dar uma dica de onde es perto o

    ResponderExcluir
  27. use o ctrl F para localizar o trecho no html do seu blog...

    em alguns casos é necessário marcar para expandir o modelo

    ResponderExcluir
  28. Oi Fabiano!! Adorei esse post.. realmente o código tá perfeito. Mas eu gostaria de colocar essa versão de resumos dos posts numa página estática e não na página inicial. Você tem as linhas de onde começa o códio html dos posts e onde termina para eu copiar e colar pra página estática??? Assim deixo a página inicial normal, com o último post completo e a página estática com este resumo de posts!

    ResponderExcluir
  29. Muito bom a dica, muitas fotos no meu blog nao aparece ,sabe o motivo?

    Tem fotos que não aparecem nesse blog, pq?
    http://www.slipfilmes.blogspot.com

    ResponderExcluir
  30. estou desesperada depois que colokei aquele negosio de colokar a numeraçao das paginas deu tudo erradoeste é apreceu um codigo em sima do meu blog e nao sei como tirar ai que nao raiva eu estou como faço para tirar o codigo de sima do meu blog

    ResponderExcluir
  31. SALVE RAPA DO DICAS PARA BLOG VCS COMO SEMPRE AJUDANDO ESCLARECENDO DUVIDAS PARABENS TOMEI A LIBERDADE DE COLOKAR LINK DE VCS NO MEU BLOG SE NAO PUDER ME AVISA Q RETIRO MAIS ACHO Q FIKA FACIL PRO PESSOAL ACHAR MTOS AINDA NAO CONHECEM PARABENS http://blacksoulfunk.blogspot.com/

    ResponderExcluir
  32. Slip Filmes
    você está enviando as fotos para o blogger ou pegando códigos de outros sites... é melhor enviar para o blogger assim não tem o risco de endereços ou códigos errados nas imagens...

    thay-loket
    esse gadget da numeração de pagina é mesmo um pouco complicado... para retirar o código também é necessário ter paciencia... não tem outro jeito para desfazer isso

    ResponderExcluir
  33. Salve! Salve meu professor sempre você ajudando a nossa equipe, muito obrigado ficou muito legal no nosso blog.

    ResponderExcluir
  34. fabiano aqui no meu template, tem mais de 6 , qual e o certo, ja tentei em 2 inao funcionou, mi ajudaaa.....

    ResponderExcluir
  35. Felippe Santos
    mais de 6 o que? post.body? se for isso é melhor não tentar colocar mais esse código pois seu template já está bastante alterado e pode causar mais erros

    ResponderExcluir
  36. Fabiano, nem vou mais tentar por esse codigo intao, mais tipo: Eu sei reduzir uma postagem com o jump break, mais eu queria por em baixo EX: LEIA MAIS >>> ou CONTINUE >>>, como posso por isso em baixo das postagens cortadas ? ajuda...

    ResponderExcluir
  37. esse tutorial mostra uma maneira de fazer isso, se quiser veja os links no inicio dele tem outras maneiras de fazer o resumo da postagem

    ResponderExcluir
  38. Hrr,por favor como faço para retirar o código,tipo meu template ta confuso por que tem 2 do '' ai eu queria tirar por que eu gostaria de fazer as postagens ficar uma ao lado da outra como um agregador mais vou deixar normal,se possível como posso tirar por passos?

    ResponderExcluir
  39. Enzo Penharbel
    você tem que achar o código que está usando e desfazer o processo, ou seja se for igual ao que mostramos neste tutorial você retira o código que falamos para colocar e volta o anterior que no começo do tutorial dissemos para retirar.

    ResponderExcluir
  40. Olá, meu problema é ao contrário, eu queria saber como se tira esses resumos de postagens... por favor se soube mande um E-mail para lucas-1-santos@hotmail.com

    ResponderExcluir
  41. Lucas, você tem que olhar o html do seu blog e ver quais codigos do resumo está usando então vendo o tutorial pode desfazer o processo

    ResponderExcluir
  42. Fabiano, como posso almentar o numero de caracters, porque esta muito pequeno o resumo das postagens,e possivel?

    ResponderExcluir
  43. Felippe Santos
    neste código não tem como alterar o numero de caracteres do resumo, veja no inicio do tutorial tem links para outras formas de mostrar o resumo e nelas tem como alterar o numero de caracteres do resumo

    ResponderExcluir
  44. É qui eu queria deixar como nessas postagens desse site: http://www.juventudecarioca.com.br, aonde as postagens tem os titulos tbm pequenos, e as postagens sao uma do lado da outra..

    ResponderExcluir
  45. vou fazer alguns testes e publicar um tutorial sobre mostrar os resumos das postagens lado a lado

    ResponderExcluir
  46. Fabiano é qui em algumas postagens a miniatura nao aparece, veja so no meu blog, em algumas postagens que contem imagens nao aparece a miniatura so o resumo, http://fjcancelapreta.co.cc

    ResponderExcluir
  47. talvez seja algum erro na hora do carregamento das imagens... se algumas aparecem não tem como modificar o código para corrigir

    ResponderExcluir
  48. Não acho esse código no meu HTML, isso pq dei i ctrl + f e não achou, na verdade não esou conseguindo achar quase nenhum código que fala aqui no blog, inclusive o de fazer alterações na largura dos textos, o que eu faço?

    ResponderExcluir
  49. queria mudar esse escerito de mais informaçoes, tem jeito?

    mateusmeirelles.blogspot.com

    ResponderExcluir
  50. Eu quero que apareça: "leia mais", iguaç no exemplo seu, mas ta aparecendo "mais informaçoes", me ajuda a mudar por favorrr

    ResponderExcluir
  51. já tentou pela pagina design, clicando para editar a postagem.. lá tem a opção de mudar o texto

    ResponderExcluir
  52. Porque no meu nao deu certo apareceu isto olha
    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: Element type "data:" must be followed by either attribute specifications, ">" or "/>". porque apareceu fiz tudo certinho :'( chorei largado

    ResponderExcluir
  53. infelizmente são detalhes, talvez faltou uma barra no final do código... tente colar os códigos no bloco de notas antes, as vezes gera erro copiar de uma pagina de internet diretamente para o html do blogger

    ResponderExcluir
  54. Maravilhoso esse codigo agora ele vai fazer aumentar a visualização das posts...
    Muito Obrigadoo Fabiano voc~e é minha salvação, como tenho 11 anos não sou TÃO experiente , mais meu blog tá muitoo legal haa e quero aparecer no Top Parceiros vou por um banner deste blog no meu ....
    Tchal

    ResponderExcluir
  55. Oii adoreii Me ajudou bastante !!! Deu certo , O problema é que nao aparece todas as postagens , ou melhor nao aparece quantas eu quero q apareça !!! Hum ..
    Grata , beijiinhos .

    ResponderExcluir
  56. mas o resumo é para a pagina inicial do blog... não para todas as paginas... embora esse código funcione em quase todas

    ResponderExcluir
  57. Oi muito bom seu artigo, você teria uma dica maravilhosa dessa para wordpress, obrigado.

    ResponderExcluir
  58. Eu nao consegui achar esse tem como vc colocar uma imagen pra mostrar onde ele ta?

    ResponderExcluir
  59. clique para expandir o modelo de wigdets e use o ctrl F para achar o código

    não tem como mostrar pois cada template é diferente dos outros

    ResponderExcluir
  60. Genteeeee, vc é mil, nem te conheço mais ja te amo, rsrsrsrsrs, bjus

    ResponderExcluir
  61. ei kra pq meus artigos ficarão sem imagens?
    vlw pelo dicas para blogs me ajuda demais.

    ResponderExcluir
  62. Juninho
    mas qual código está usando? se é o desta postagem era para mostrar as imagens ... claro desde que os posts tenham imagens

    ResponderExcluir
  63. so uma pergunta e por favo me responda como faço para almentar as imagens.
    Por favo alguem ajuda contato ai pelo msn
    la-ncinho@hotmail.com

    ResponderExcluir
  64. neste código o tamanho das miniaturas é automatico...

    ResponderExcluir
  65. Tem como colocar o título logo ao lado da imagem, e também aumentar o tamanho da imagem? (Pode ser com o uso de um outro código). Obrigado.

    ResponderExcluir
  66. Fabiano, coloquei esse código no meu blog e funcionou bem, mas deu um problema que é o seguinte:
    só estão aparecendo 3 postagens e eu coloquei pra aparecer 10.
    Será que tem algum erro ou tenho que fazer algum ajunte?
    Da uma olhada:
    http://gataarrepiada.blogspot.com
    Abraço.

    ResponderExcluir
  67. Comigo não funcionou mas mesmo assim obrigado, http://trasshygirl.blogspot.com

    ResponderExcluir
  68. Trashy Girl
    veja se nas tentativas que fez não deixou "restos de códigos" isso pode atrapalhar

    ResponderExcluir
  69. Nossa! Eu tava procurando por isso faz tempo! Sempre quis colocar jump break, mas nunca dava certo! Tinha que ser esse site para me salvar... Amo muito!

    Muito obrigada!
    bjs

    ResponderExcluir
  70. olá fabiano seu site é a salvação de muitos blogueiros inclusive eu, gostaria de saber sobre o código desse post,se tem como eu trocar o link (mais informações)por outro texto? e também gostaria de saber se tem como linkar as miniaturas.

    ResponderExcluir
  71. Video Galeria X

    troque esse trecho pelo texto que desejar: < data:post.jumpText/ >

    ResponderExcluir
  72. olá fabiano, vim para agradecer pela rapidez e eficiência, ficou perfeito, obrigado pela atenção!

    ResponderExcluir
  73. Olá, tudo bem?
    Já conheço seu blog tem um tempinho, resultado de muitas dicas que o mesmo me ajudou, quero te agradecer, por todas elas, não entendia muito disso e seu blog tbm me ajudou muito.
    Nesse momento, sou sua mais nova seguidora. Fique com Deus.
    http://anjos-anjos04.blogspot.com

    ResponderExcluir
  74. ei como eu coloco algo ali por exemplo uma caixinha encima das palavras Leia mais como faço isso ?
    Espero que responda logo !^^

    ResponderExcluir
  75. pode formatar o texto como qualquer outro usando o CSS

    ResponderExcluir
  76. Fabiano Roberto presizo muito da tua ajuda, é o seguinte no Mozila Firefox funciona tudo certinho mais no Chrome as postagens fica normais, queria muito ponhar esse codigo que vc ponhou, pois meu template já veio com esse codigo. Mais não estou conseguindo. Desde Já obrigado

    ResponderExcluir
  77. Juninho Pagodão
    infelizmente tem códigos que dão diferenças entre os navegadores... o código que usei é esse:Mostrar resumo da postagem

    ResponderExcluir
  78. Fabiano já usei este seu codigo em outros templates e deu certo, so que nesse que estou atualmente ele já veio com um codigo parecido com este e porem não estou achando o ponto certo para colar o codigo. No caso queria tirar o que estar e ponhar o seu. Desde já obrigado, e desculpa o incomodo.

    ResponderExcluir
  79. retirar códigos as vezes é mais dificil que colocar...

    tem que achar o mesmo tutorial que usou para colocar o código e tentar desfazer

    e só depois colocar outro código

    ResponderExcluir
  80. Fabiano. Coloquei seu código e funcionou perfeitamente. Mas estou tendo o mesmo problema que o amigo ali de cima e ficamos sem resposta...na pagina inicial so aparece 1 ou 2 posts, mas esta configurado para aparecer 10. como resolvemos?

    souz.vitor@hotmail.com

    www.feelthebeat.com.br

    ResponderExcluir
  81. Fabiano,
    Agradeço por ter me ajudado a fazer o resumo com miniaturas, mas não consegui colocar a miniatura da imagem do lado direito ou ao lado do texto.

    Obrigada!

    ResponderExcluir
  82. Fabiano,
    Estou aqui de novo pra dizer que consegui colocar a miniatura da imagem do lado direito!
    Mas seria possível aumentar o tamanho da imagem?
    Achei pequena demais.
    Obrigada!

    ResponderExcluir
  83. Vitor Souza
    é estranho dizer isso pois esse código não tem nada a ver com o numero de postagens na pagina inicial... nas configurações do seu blog está selecionado numero de postagens ou dias na pagina inicial?

    Magna Flor (Viviani)
    esse código não tem configuração do tamanho da imagem... mas o que esta´no link no inicio do tutorial tem...

    ResponderExcluir
  84. olá, eu quero que as minhas postagens fiquem do geito que estão.. ela ja porta automaticamente..
    Mais não aparece o ''Continue Lendo''.
    só quero adicionar o continue lendo, sem alteram o formato da postagem..
    pode me ajudar?

    ResponderExcluir
  85. veja esse outro tutorial Mostrar resumo da postagem

    ele faz o resumo mas com outros códigos... e você escolhe até onde aparece cada post

    ResponderExcluir
  86. Simplesmente Fantastico, parabens Me ajudou muito maravilhoso era exatamente o que tava precisando!

    ResponderExcluir
  87. Muito bom cara, consegui fazer, só tenho uam dúvida/pedido, como eu poderia fazer para por o titulo da postagem ao lado da imagem do post resumido, tipo como no ocioso e minilua?

    ResponderExcluir
  88. Matheus Ribeiro , use nossa pesquisa e veja resumo da postagem... tem varias maneiras de fazer...

    ResponderExcluir
  89. Fabiano, fiz a procura detalhada aqui no seu site e usando a barra de pesquisa e infelizmente não achei, mas obrigado assim mesmo, suas dicas já me ajudaram muito.

    Abraço

    ResponderExcluir
  90. como aumento o numero maximo de caracteres que vão aparecer?

    ResponderExcluir
  91. esse código não tem configuração de numero de caracteres, veja neste link Mostrar resumo da postagem, lá é possivel escolher o local exato onde será o "corte" do texto : resumo

    ResponderExcluir
  92. No meu HTML do meu blog não tem , como faço?

    ResponderExcluir
  93. Deixa, foi noobice minha -.-... Mais a dúvida agora é outra, tipo ele mistura as linhas, ex: meu post é assim:

    teste: 1
    teste2: 12345
    test10: 10

    e ele coloca assim no leia mais:

    teste: 1 teste2: 12345 test10: 10

    coloca tudo junto, então fica tudo embolado, queria saber como fazer que ele não misture as linhas

    ResponderExcluir
  94. Ariel
    vou fazer uns testes e publicar um tutorial sobre esse assunto, pois mostrar as post lado a lado.

    ResponderExcluir
  95. cara você é muito bom tem talento,mas vou lhe dar uma dica,antes quando marcava:


    você entra na pagina editar html, marque a opção para expandir modelos de widgets e procura por post.body, deve estar deste jeito no seu blog:

    eu perdia o maior tempo procurando no caso

    mais nesse tuturial como em muitos outros você esqueceu de mencinar para apertar Ctrl F

    blz,pede pro pessoal apertar contra o f para achar a palavra que eles tão procurando....

    ResponderExcluir
  96. Dragon Ball é D+, em varios tutoriais já falei do ctrl F, mas você tem razão neste aqui não mencionei isso... vou alterar a postagem agora

    ResponderExcluir
  97. Quero saber como colocar imagem na data ao lado do post!

    ResponderExcluir
  98. Vanessa
    já testei alguns códigos para fazer a data numa imagem, mas eles deram errado.

    mas pode tentar colocar a imagem ao lado diretamente pelo html do blog, marque para expandir o modelo e procure por

    <span><data:post.dateHeader/></span>

    deve achar varios então faça testes para achar o certo e coloque o código da imagem, assim:

    <img src='http://img1.blogblog.com/img/icon18_wrench_allbkg.png' border='0' style='float:left' />

    ResponderExcluir
  99. Muito legal! em algumas postagens não apareceu com imagem, mas valeu, eu tinha um baita trabalho pra fazer meus resumos, não ficou tão bom pois é irregulável quando se trata de individualismo, mas eu tenho 1600 postagens e não tenho tempo para ficar editando alguns mínimos detalhes.
    Valeu mesmo cara...........!!!!!!

    ResponderExcluir
  100. bruno Ferreira
    se a postagem não tiver imagem não terá miniatura..

    se aparece na maior parte é porque colocou o código de forma correta, então não tem o que fazer

    ResponderExcluir
  101. Fiz e ficou do jeitinho que eu queria...
    só tem um problema, ao clicar pra ler aparece uma página com esse post e outros abaixo todos apenas com o resumo da postagem...
    e agora como faço pra ler o post inteiro?

    ResponderExcluir
  102. tem que clicar em cada post para ler. a idéia é expandir (mostrar completo) um post por vez

    ResponderExcluir
  103. O problema não é este você não entendeu
    A postagem não aparece inteira ao clicar apenas um resumo.

    alicercesfirmes.blospot.com

    ResponderExcluir
  104. Franciele Cavalcante B. de Oliveira
    sem template é bem modificado.. .deve ter baixado de algum site da internet... seria preciso editar e fazer testes no seu template para achar o erro...

    compare a linha de código:
    <a expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'>

    ResponderExcluir
  105. achei essa linha e está correta, e agora?
    Não baixei pela internet é um template simples do blogger que eu modifiquei, o único erro é esse!

    ResponderExcluir
  106. veja o trecho inteiro... deve ter algo diferente

    ResponderExcluir
  107. Como faço pra exibir as postagens em miniatura lado a lado?

    ResponderExcluir
  108. Testado e RESOLVIDO.

    Muito obrigado.

    Felicidade, harmonia e saúde para você.

    Valeu

    ResponderExcluir
  109. Como faço pra colocar uma imagem no lugar de "Mais informações »"?

    ResponderExcluir
  110. Ariel
    para usar uma imagem neste trecho

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

    coloque o endereço de uma imagem, o código fica assim:


    <a expr:href='data:post.url + &quot;#more&quot;'expr:title='data:post.title'><img src="endereço da imagem" border="0" /></a>

    ResponderExcluir
  111. vlw :), não chegou o email avisando do comentário, fui ver só agora...

    ResponderExcluir
  112. não tá encontrando os codicos post.body e na minha página de html!
    para fazer isso.
    Obg.

    ResponderExcluir
  113. Brunno
    precisa marcar a opção expandir modelo na pagina editar html para achar o post.body

    ResponderExcluir
  114. Olá
    coloquei o código mais não estar parecendo a imagem da postagem!
    e também como faz para aumentar o tamanho do texto ?
    Obrigado.

    ResponderExcluir
  115. Brunno
    o tamanho do texto é automatico... igual a postagem do seu blgo.

    sobre a imagem veja se o feed do seu blog está configurado para publicação completa

    ResponderExcluir
  116. Acho muito legal suas dicas. Parabéns! Tenho uma dúvida: tem como definirmos o qto de texto aparecer antes do "Leia mais"?

    ResponderExcluir
  117. IPUB Colatina

    com o código deste tutorial não... ele é automatico.

    mas aqui tem outro Mostrar resumo da postagem

    lá você pode escolher em cada postagem até onde vai o resumo, mas terá que fazer em toda postagem.

    ResponderExcluir
  118. gostaria de saber se blogspot tem limtie de postagem porque ja to 33mil postagens

    ResponderExcluir
  119. Rage
    Quantidade de postagens: não há limite de postagens em um blog. A menos que sejam excluídas manualmente, todas elas são salvas em sua conta, independentemente de você publicar os arquivos ou não.

    essa resposta foi copiada da pagina de ajuda do blogger

    http://www.google.com/support/blogger/bin/answer.py?hl=br&answer=42348

    ResponderExcluir
  120. Como edito o número de caracteres visíveis antes do resumo automático?

    ResponderExcluir
  121. teria como eu adicionar isto a penas uma postagem

    ResponderExcluir
  122. Ben

    veja aqui
    Mostrar resumo da postagem

    com o código do link você pode colocar o resumo em quais postagens quiser, mas se for em apenas uma (ou poucas) postagens acho que não vale a pena

    ResponderExcluir
  123. para editar o numero de caracteres do resumo tem que usar esse tutorial do link do comentário anterior: Mostrar resumo da postagem

    ResponderExcluir
  124. Ben
    o unicio jeito é tentar olhar o tutorial e desfazer as alterações do seu html.

    ou seja apagar o código do resumo e colocar novamente o código normal do blog

    ResponderExcluir
  125. parace que codigo muda por que ja tentei isso anteriormente mais ele nem no ctrl+F acha o primeiro codigo porém eu achei a parte que tem escrito leia mais tentei apagar partes codigo mais deu erro no blogger claro que teste antes em visualizar mais tudo bem acho consigo

    ResponderExcluir
  126. é consegui apaguei uma parte do codigo aonde localiza o leia mais e substitui por e deu certo

    ResponderExcluir
  127. é realmente retirar as coisas do blog as vezes dá mais trabalho rsrs

    mas o importante é que deu certo

    ResponderExcluir
  128. Muito bom , o bom é que nossos blogs caregam mais rapidos

    ResponderExcluir
  129. tem como colocar a miniatura do lado do titulo?

    ResponderExcluir
  130. @Antonia Alves o código deste tutorial já mostra a miniatura se no seu blog não funcionou veja se a configuração do seu feed está marcado a opção completa

    ResponderExcluir
  131. Mano isso n da certo na nova atualizaç~~ao do blogger

    ResponderExcluir
  132. seu template é padrão do blogger ou baixou de algum site?

    já testei o código em modelos novos do blogger e funcionou.

    tente novamente, talvez tenha apagado alguma letra ou sinal por engano

    ResponderExcluir
  133. vc nao entendeu minha pergunta anterior como "SOH PAGODE" a respeito desse "leia mais"
    eu queria saber se tem como eu colocar apenas em algumas postagens, e nao em todas as postagens do blog?..entendeu?teria como?abraços

    ResponderExcluir
  134. @Vitinho - TYF aqui tem um outro código que você escolhe quais postagens tem o resumo
    Mostrar resumo da postagem

    ResponderExcluir
  135. Fabiano, como aumento o tamanho da imagem e o número de caracteres no texto da postagem ?

    ResponderExcluir
  136. @PIRAPEMAS.COM I Credibilidade em notícia
    neste código não tem como fazer essas alterações, mas veja no inicio do tutorial tem links para outros códigos de resumo da postagem com miniatura da imagem

    ResponderExcluir
  137. Cara tem como colocar as imagens lado a lado como no template do mini lua?

    ResponderExcluir
  138. Parabéns pelos seus artigos muito bons mesmo Deus abençoe.

    ResponderExcluir
  139. Valeu esse mim ajudou bastante galera você são de mais

    ResponderExcluir
  140. Fabiano fiz o procedimento e está OK mas as imagens do resumo ficam distorcidas....tem como arrumar isso? www.veramoraes.com.br / Vera Moraes. Obrigada!

    ResponderExcluir
  141. é normal as imagens do resumo ficarem distorcidas não tem como arrumar

    isso acontece porque o código do resumo usa a imagem da postagem e altera o tamanho dela

    ResponderExcluir
  142. Fiz isso tudo direitinho q vc ensinou no post mas o código não funcionou, abro a home e os posts continuam normais!!

    ResponderExcluir
  143. Esse codigo não está funcionando no meu blog, e quando funciona as imagens não aparecem, nem o link "Ver mais"

    ResponderExcluir
  144. veja se a configuração do seu feed está marcador completa
    muitas vezes a imagem da miniatura não aparece por causa disso

    ResponderExcluir
  145. Eu tenho um post, muito grande, eu queria colocar ele como resumo... Mas, SÓ AQUELE RESUMO, não quero todos os meus posts resumidos, alguém sabe como faz???

    ResponderExcluir
  146. aqui tem um outro código para Mostrar resumo da postagem

    que você pode escolher em quais postagens vai usar

    ResponderExcluir
  147. FABIANOOOOOOOOOOOOOOO
    Tem como aumentar o tamanho da imagem que fica no resumo?

    ResponderExcluir
  148. @Állef Diego com esse código não tem como alterar o tamanho da imagem

    mas no link no começo do tutorial sobre Postagem expansível com miniatura da imagem é possivel definir o tamanho da imagem

    ResponderExcluir
  149. Como que eu faço para deixar, por exemplo 10 postagens em cada pagina do meu blog, não só na pagina principal, eu já tentei mais não consigo. Tipo no meu blog está assim, na pagina principal fica por exemplo 7 postagens, já na pagina seguinte fica só 1, e assim vai e eu não queria deixar assim, como que eu faço para arrumar.

    ResponderExcluir
  150. @Alexandre Stankus não tem como fazer esse tipo de organização

    até é possivel alterar o numero de postagens nas outras paginas mas todas serão o mesmo numero

    ResponderExcluir
  151. Muito Bom cara, era isso que eu estava procurando para Meu Blog... Parabéns, seu site é simplismente sensacional.. O melhor....

    ResponderExcluir
  152. Como faço para mudar o texto leia mas... para Continue lendo ?

    ResponderExcluir
  153. @Angelo apague esse trecho <data:post.jumpText/> e coloque o texto que desejar

    ResponderExcluir
  154. Como eu faço pra substituir o texto leia mais ou qualquer otro la por uma imagem?

    ResponderExcluir
  155. o texto leia mais é esse código:
    < data:post.jumpText/ >

    então pode trocar por uma imagem se quiser

    ResponderExcluir
  156. MANO EU COLOQUEI O BANNER DO SEU BLOG NO MEU!!!
    O SEU BLOG É SHOW!!MEU BLOG http://www.vejaaki.com/

    ResponderExcluir
  157. Aqui no teu blog, após o post tu tens 4 indicações "Outros tutorias para ajudar blogueiros" aí aparece uma foto de cada postagem com link. Como faço isso?
    Outra coisa fiz essa modificação que sugeres aqui, mas eu queria que aparecece mais fotos da postagem, tem como? obrigadãooo
    Sheila
    http://vidasuculenta.blogspot.com/

    ResponderExcluir
  158. Muito ótima a dica! A maneira mais fácil dentre todos os blogs que eu procurei...
    Mas, como faço para aumentar o tamanho do texto, o número de caracteres, que fica antes do "Leia mais"?

    ResponderExcluir
  159. veja na parte final do tutorial:
    .jump-link {text-align: center;margin:auto}
    .jump-link a{font-size:16pt;color:#f00}
    .jump-link a:hover{color:#00f}

    é só trocar o numero 16

    ResponderExcluir
  160. Olá gostari de retirar este estilo de postagem tenho o teplate slated do btemplates e ja tentei de tudo mas não consigo retirar o este estilo de postagem
    POR FAVOR NECESSITO DE AJUDA URGENTE !!!

    ResponderExcluir
  161. editar templates prontos é mesmo complicado, veja aqui:
    Achar e Resolver Problemas com Códigos HTML no Blog
    isso pode achar os códigos

    ResponderExcluir
  162. COMO EU FAÇO PARA AS IMAGEM EM MINIATURAS FICAREM MAIORES?????????

    ResponderExcluir
  163. Diego Rocha

    você pode alterar esse linha para colocar o tamanho da imagem:

    < img expr:src='data:post.thumbnailUrl'height='72' style='width='72'/ >

    com o tamanho que quiser no lugar do numero 72, mas isso vai aumentar o tamanho da imagem esticando a original ou seja pode perder qualidade

    ResponderExcluir
  164. Fabiano acabei de descobrir que tem um script mais fácil de ser aceito por vários outros Templates la no blog template para VOCÊ! Tem um hack muto bom e mais atualizado e tem o nome do desenvolvedor, vai lá olhar e se possível atualize seu post! se voê quiser!

    ResponderExcluir
  165. poxa mim arepende de coloca isso agora quero tira como fasso por favor ajuda

    ResponderExcluir
  166. tente que tentar desfazer o processo, ou seja retirar os códigos do resumo.

    não tem um jeito mais simples de fazer

    ResponderExcluir
  167. Olá Fabiano, até semana passada, quando eu publicava o limk do meu blog no FB aparecia o resumo e o thumb ao lado, mas agora parou de funcionar sem eu ter feito qualquer modificação na html. Sabe se o FB faz alguma modificação? Tentei colocar esse código que vocë passou e não deu certo. estou passando meu código atual para vocë dar uma olhada e ver o que devo mudar, dei espaço no div pro comentário entrar. Obrigado Augusto







    ResponderExcluir
  168. Augusto Cavalcanti ~~ Oceanólogo ~~
    durante uns 3 dias esse erro aconteceu comigo também, mas hoje (24/02/2012) voltou ao normal sozinho.

    acabei de compartilhar o link da enquete: Qual o Melhor Sistema de Comentários para Usar no Blog

    e funcionou normalmente: http://www.facebook.com/dicasparablogs

    ResponderExcluir
  169. Meus parabéns! Funcionou muito bem. Obrigado mesmo, só o código ficou um espaço no final os menos experientes como eu terão dificuldade em localizar rsss!

    ResponderExcluir
  170. pow não esta aparecendo as miniaturas nem nada
    o que eu faço ?

    ResponderExcluir
  171. veja se a publicação do seu feed está configurado para publicação completa

    ResponderExcluir
  172. Fabiano,coloquei um código como esse no blog que estou editando, e fica aparecendo o seguinte: createSummaryAndThumb("summary3746971645333432143"... Leia Mais >>... Como retirar isso e deixar só o leia mais.Também quero colocar as imagens em miniatura lado a lado e com o resumo embaixo da imagem?E como retirar a data da postagem de cima da imagem,já que coloquei um ícone ao lado com a data?Fica aparecendo as duas.

    ResponderExcluir
  173. Por favor, dá uma olhada pra você entender o que quero dizer: amazingcakery.blogspot.com Lá tem apenas imagens de teste.

    ResponderExcluir
  174. Fabiano,consegui acertar.Ele estava com outro código.Agora coloquei o do Prof Fabiano(rs).Só que só aparece com uma imagem e não aparece leia mais.Tem como escrever “leia mais”?

    ResponderExcluir
  175. veja na pagina layout clicando para editar a postagem lá tem como trocar o texto mais informações.

    se não funcionar procure no seu html, mas precisa expandir o modelo para achar, pesquise pelo texto "mais informações" e troque pelo que você quiser

    ResponderExcluir
  176. Fabiano, me fale uma coisa, fiz isso ficou correto, porem todas as postagem ficam sem quebra de linha, perdem as configurações sabe como posso concertar isso: veja como ficou no meu blog: www.veneraveis-criaturas.blogspot.com
    abs.
    Gilmar

    ResponderExcluir
  177. Gil Lima
    é normal o código mudar alguma coisa na formatação quando mostra o resumo, mas na pagina da postagem deve ficar normal.

    ResponderExcluir
  178. como fazer para aparecer os icones de video tb?
    caso o post tenha texto e video, como fazer para no resumo aparece a imagens do icone do video?
    valeu.

    ResponderExcluir
  179. PEU PEREIRA
    não tem como fazer aparecer a miniatura do video

    o que você pode fazer é postar uma imagem junto com o video então o resumo mostraria a imagem

    ResponderExcluir
  180. Fabiano eu coloquei no meu blog gual este jeito que está aqui,porém eu queria tirá-lo pq eu vi um outro post seu que fica mais bonitinho.
    Pode me ajudar?

    (o post que eu achei melhor é >> postagem Expanssivel com miniatura das imagens)

    ResponderExcluir
  181. para retirar tem que apagar os códigos e voltar o código html original, ou seja usar o tutorial ao contrário

    ResponderExcluir
  182. Olá, eu queria fazer minha pagina inicial mostrar somente as miniaturas e seus títulos, tudo lado a lado e de cima pra baixo, mostrando todas as postagens na tela, 4 ou 5 miniaturas por linha, como se fosse o LinkWithin, só que em várias linhas da tela. Queria que minha página inicial fosse como a de um agregador de links. Tem como eu fazer isso no meu template? Acredito que esse código aew mesmo, com algumas modificações, sirva pra isso.

    proPHano

    ResponderExcluir
  183. proPHano
    vou fazer um tutorial sobre isso mas vou demorar uns dias para publicar porque surgiram algumas outras novidades no blogger que preciso escrever sobre elas antes.

    ResponderExcluir
  184. Nossa, então fico ansioso no aguardo do seu tutorial e das suas postagens sobre as novidades do blogger.

    Parabéns e Obrigado!

    ResponderExcluir
  185. não consigo retirar o código
    oq faço?

    ResponderExcluir
  186. precisa marcar para expandir o modelo de widgets para achar o código

    ResponderExcluir
  187. Fabiano Roberto o meu nao apareceu a imagem da postagem não;;pq cara??

    ResponderExcluir
  188. anonimo, mas as suas postagens tem imagens? era para funcionar esse código funcionou bem em todos os templates que testei.

    veja se colocou os códigos nos lugares certos

    ResponderExcluir