Dominio: codigosblog.com.br
Chave: af255c39c6cbf2ba03ac5b531649215539d8d61a
Hora do cache: 1512971086
Vida do cache: 1513014286
Status: 1
Mensagem: Centive nao respondeu
Chave do Pedido: 11808bbc6205bade68f0b70c302eaa74d4305945
Chave do Produto: PROKEY
Scroll Top

Junte-se a 22.515 pessoas que
decidiram aprender tudo sobre Blogs,
SEO e Monetização.

Hospedagem - 728 x 90

Blogger Postagens

Resumo automático apenas nas postagens para Blogger

Resumir as postagens do blog ajuda na organização e facilita a leitura de vários títulos e introduções. Importantíssimo para todos os blogs.
Existem vários e vários tutoriais de como resumir suas postagens, de forma automática ou manual. Cabe você escolher a melhor forma para os seu trabalho.

Recentemente encontrei um tutorial muito bacana, ensinando a resumir de forma automática todas as postagens, colocando sempre uma imagem principal na lateral esquerda do resumo.

Veja a imagem:

O melhor desse script, é que as páginas individuais do blog não são prejudicadas. O resumo é aplicado exclusivamente nas postagens da página inicial.

Leia também:

O tamanho do resumo e tamanho das imagens é configurável. Além da opção de resumo automático com mais caracteres (ou menos) caso não tenha nenhuma imagem na postagem resumida.

Caso você queira um resumo manual, onde você decide em cada post se vai resumir ou não e qual o tamanho do resumo, leia:

Vamos aprender a instalar o resumo automático no Blogger:
1) Faça login no Blogger, entre em “Modelo” do seu blog.

2) Clique em “Editar modelo” (está no final da página).
Caso não apareça essa opção, use o Blogger in Draft.

3) Marque a opção “Expandir modelos de widgets” e procure (Ctrl + f) por:

</head>

4) Cole o seguinte código ANTES do código encontrado:

<!-- Resumo automático -->
<script type='text/javascript'>
summary_noimg = 330;
summary_img = 300;
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) {
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>
<!-- Fim resumo automático -->

Configure o resumo:
summary_noimg = Número de caracteres do resumo caso não tenha imagem na postagem;
summary_img = Número de caracteres do resumo caso tenha imagem na postagem;
img_thumb_height = Altura da imagem em px;
img_thumb_width = Largura da imagem em px.

5) Agora procure por:

<data:post.body/>

6) Substitua o código encontrado por:

<!-- Resumo automático -->

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

<data:post.body/>

<b:else/>

<p><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'><a expr:href='data:post.url'>Leia mais...</a>

</span></b:if>

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

</b:if>

<!-- Fim resumo automático -->

Leia mais... = Texto do link para continuar lendo a postagem. Pode ser editado.

7) Clique em "Visualizar". Se as postagens estão resumidas clique em “Salvar Modelo”.

Importante: Se você usa outra forma de resumo de postagens, é importante retirar antes de instalar um novo script.

Esse tutorial foi desenvolvido pelo blog Dicas e Encomendas.



De um play no vídeo abaixo e aprenda a Criar blogs Profissionais




Gostou deste artigo? Ajude nosso projeto.
Compartilhe em suas redes sociais nos botões abaixo:

82 Comentários

  1. Não consigo de jeito nenhum encontrar esse trecho no meu HTML:

    Quem pode me ajudar?

    • Clica sobre o código e depois Ctrl+f.

      • Paulo, Obrigado pela dica do Ctrl+F dentro do HTML, dessa eu não sabia. antes eu o utilizava sem clicar no HTML, dessa forma conseguia encontrar algumas coisas e outras não. Mesmo seguindo sua dica e encontrando os códigos, fiz tudo conforme instruído e nada foi alterado em meu blog. O que pode ser? Será que estou interpretando algo que você escreveu de forma errada? Tipo colar o código antes do “head” ou substituir o código encontrado?

  2. Ana Nataly disse:

    Olá,
    Tente fazer isso no meu blog. Mas não aparece a postagem resumida apenas o Título. O quê eu tô fazendo errado???

  3. Olá Paulo,

    Queria reportar a uma coisa. Ao instalar o código fica tudo beleza, mais ele está dando conflito com as preferencias de pesquisa do blogger. já perdi as contas de quantas vezes precisei refazer as configurações. Como você sabe existem três data:post.body no blogger, pelo menos em meu layout. O correto seria instalar no segundo. Ok! ou estou errado? Pois ao colocar ele no segundo e confirar a meta descrição nas pesquisas personalizadas ele não funciona. Ai pensei em mudar de lugar e colocar no lugar da terceira data:post.body e também funcionou, ai ele funciona com a configuração de meta description feita pelo painel mas ao remover a meta description o resumo para de funcionar.

    Outra coisa é que todas as configurações desaparecem sozinhas, desde meta description até tags de cabeçalho, robots.txt, etc… Some tudo. Ainda não entendi bem o motivo então venho aqui dizer que se poder me ajudar dede já te agradeço. Um grande abraço..

  4. Cara, finalmente consegui esse tipo de resumo do jeito que eu queria. Segui o passo a passo e deu exatamente tudo certo, muito obrigado.

    Se puder me tirar uma dúvida, eu agradeço: existe alguma probabilidade de eu ter algum problema com esse script no futuro? E se tiver, existe alguma maneira de me prevenir para que o código não pare de funcionar?

    Grande abraço e mais uma vez obrigado!

  5. André Luis disse:

    Ola, eu uso este código hack em vários templates só que não sei por que não está querendo funcionar mais vc saberia o que está ocorrendo o Blogger fez alguma atualização que não deixa mais usar? Outro problema: Quando pego um template que já tem o hack instalado e subo dá certo o resumo mas quando coloco o hack para dividir a área de postagens fico todo desconfigurado, não sei o que está acontecendo.

  6. Vanusa disse:

    Olá Paulo! Consegui colocar o resumo no meu blog e achei uma maravilha. Só ainda não consegui justificar o texto, como devo fazer? Parabéns pelo blog e muito obrigada!

  7. Lucas disse:

    Eu efetuei todo o processo para colocar o resumo, só que não consegui! 🙁

  8. Cristiano disse:

    Eu não vi diferença nem uma no blog 🙁

  9. Joana disse:

    Não consigo encontrar o em que linha está?

  10. keilla disse:

    olá,toda vez que tento resumir minha imagem não fica na lateral,sempre fica em cima…como faço para ficar na lateral???

  11. Anderson disse:

    Gostaria de saber porque quando posto vídeos não aparecem nem imagem e nem o vídeo no resumo da página inicial. Alguém pode me ajudar?

  12. Olá !
    Fiz tudo o que o tutorial pedia, mas quando visualizo aparece “Bad Request Error 400” sabe o que estou fazendo de errado? Pode me ajudar?

  13. Bruno Bezerra disse:

    Olá Paulo!
    Testei o código aqui e deu certo!
    Forte abraço.

  14. Oi Paulo!
    Acabei de ler o seu post ocultar comentários nas páginas estáticas, mas eu gostaria de ocultar na página principal, porém eu uso o resumo de postagem, tem como me ajudar por favor?
    Obrigada!

  15. Mauro disse:

    Nao funcionou no meu, pode me ajudar?

Para enviar seu comentário, preencha os campos abaixo:

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