Muitos blogs hospedados no Blogger/Blogspot acabam se tornando longos demais, o que dificulta a navegação e torna o carregamento da página lento. Para resolver este problema, nós temos algumas opções como alterar o número de postagens na página inicial ou exibir somente os títulos das postagens, mas isso nem sempre cai bem em todos os blogs. A outra alternativa, que será mostrada aqui, é exibir postagens resumidas na página inicial, e que, quando clicadas, mostram o conteúdo completo.
Para exibir postagens resumidas na página inicial, de marcadores e arquivo do seu blog, faça o seguinte:
Não se esqueça de fazer o backup do seu template antes de realizar as alterações no código, clicando em Baixar modelo completo.
</head>
Então cole o seguinte código ANTES:<b:if cond='data:blog.pageType != "item"'>
<script type="text/javascript">
function checkFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
var found = 0;
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost") {
spans[i].style.display = 'none';
found = 1;
}
if ((spans[i].id == "showlink") && (found == 0))
spans[i].style.display = 'none';
}
}
</script>
</b:if>
<div class='post-body'>
E SUBSTITUA por:<div class='post-body' expr:id='"post-" + data:post.id' >
<b:if cond='data:blog.pageType == "item"'>
<style>#fullpost{display:inline;}</style>
<p><data:post.body/></p>
E SUBSTITUA por:<p><data:post.body/></p>
<b:else/>
<style>#fullpost{display:none;}</style>
<p><data:post.body/></p>
<span id='showlink'>
<a expr:href='data:post.url'>Leia mais</a>
</span>
<script type='text/javascript'>
checkFull("post-" + "<data:post.id/>");
</script>
</b:if>
Substitua a parte em laranja acima pela texto do link que levará à postagem completa. Em geral utiliza-se “Leia mais” ou “Continue lendo”.
Digite aqui o resumo da postagem
<span id="fullpost">
Digite aqui o restante da postagem
</span>
Clique em Salvar Configurações. Agora todo novo post que você criar, iniciará com o código acima. O Hack consiste em esconder tudo o que estiver entre <span id="fullpost"> e </span> (considerando o HTML da postagem). Basta colocar cada parte no lugar certo, que o Hack funcionará sem maiores problemas. Quando não quiser uma postagem resumida, basta apagar todo o código e escrever a postagem normalmente. Para configurar o Hack em postagens já existentes, você deverá editar o HTML manualmente e incluir os dois trechos de código.
Pronto, o Hack já está completamente instalado. Agora é só usá-lo de acordo com a orientação acima.
Se o Hack não funcionar ou causar erros no seu template, utilize o backup que você criou e clique em Fazer Upload, então refaça todo o processo. Se quiser retirar o código que aparece em todas as postagens, acesse o seu Painel do Blogger e selecione Configurações, então clique em Formatação e encontre o item Modelo de Postagem. Então é só remover o código que aparece na caixa de texto e Salvar Configurações.
Referências:
UsuárioCompulsivo | Katatempla
Anterior
Assine o Feed
Adicione ao Google
Receba por Email
Twitter
Muito bacana esse hack, mas eu particularmente não gosto de resumo porque é mais um clique que me levará a algo.
Já vi este JavaScript em algum lugar...
[]'s
Compulsivo
Interessante. Mas não sei porque ainda prefiro o full post na inicial.
Abs,
Monthiel.
Eu uso essa hack. Segui passo a passo o tutorial "Como crio resumo de postagens expansíveis?" em:
Central de Ajuda Blogger
No entanto, toda vez que incluo o código span class="fullpost" e alterno entre o modo "HTML" e "Escrever", e depois retorno ao modo "HTML", o código some.
Como faço para que isso não aconteça?
Postei essa dúvida no Fórum do Blogger, mas até agora ninguém soube me responder.
Se você ou algum leitor sabe como resolver esse bug, me avise!
Abração
Gabriel Dread
Cara Valeu!!
Foi muito útil para mim.
Sempre surpreendendo.
Parabéns!!!
Já usei essa dica em um outro template,mas o que eu uso atualmente não aceita este hack! eu poderia criar ele?
se alguém me ajudar fico grato! http://jipagito.blogspot.com
jipagito.contato@gmail.com
amigo o div class='post-body' não encontro em lugar algum o;O
colega eu tambem não encontro o div class='post-body' ??
Muito bom este post
Olá, gosto muito do seu blog e sigo o feed, parabéns!
Estou precisando fazer resumos de algumas postagens no meu blog, apesar de seguir todas as instruções não encontro o codigo "div class='post-body" nos templates, mesmo o CTRl+F acusa como texto não existente... o mais proximo que achei foi 'post-metadata' mas nenhuma tentativa deu certo... produzi alguns textos maiores no meu blog e precisava muito desse recurso pra não perder a qualidade visual ou ficar cansativo, pode me ajudar? Agradeço desde já, abraços.
raianareis@hotmail.com
www.tocou.blogspot.com
quando o resumo e grande esse hack naum funciona!!!
tem como consertar???
obs:como e comentario naum aceita codigo ,entaum vou subistituir < > por ()
ja sei como resolver o meu caso,eu coloco a primeira e a sugunda parte nos seus devidos lugares,em seguida eu clicko em "editar html" procuro por:"(span id="fullpost")" "no meu caso" logo depois disso tem escrito (/span)(dai o problema)
ex.:
blablabla
(span id="fullpost")(/span)
blablabla
o que eu faço é recortar (/span) e colar no final da postagem,
ex.:
blablabla
(span id="fullpost")
blablabla
(/span)
depois so é publicar que funciona.
ops erro,esqueçam o que eu disse sobre recortar (/span) e colar no final,só façam excluir (/span).
flw
como dizia eu mesmo:
-futucando é que se aprende
srsrsrsr
Kra muito Obrigado pela dica deu certim aqui no meu blog
parabens,, sucessoo com seu blog
eu tambem não encontro o div class='post-body'
:/
Parabens pelo blog!,encontrei aqui quase tudo o que eu precizava! :D
Quero tirar esse hack "conitnue lendo" do meu template, como faço?
Pode me ajudar?
Att.
mailza
Quero dar os parabéns ao Icebreaker. Esta é a primeira vez que venho nesse blog e fiquei impressionado pela sua qualidade. O blog é um pouco sobrecarregado de informações, parece meio apertado, mas é muito organizado, e seu excesso de informações fica como uma grande qualidade. Tudo é muito bem explicado também.
Esta postagem em especial me ajudou muito. Já havia lido sobre isso em outro lugar antes, mas a explicação aqui fluiu de modo bem simples, claro, conciso.
Parabéns e continuem o bom trabalho. Já assinei o RSS.
oi cara vc disse assim. ( Para que todas as novas postagens já venham configuradas para o Hack, acesse o seu Painel do Blogger e selecione Configurações, então clique em Formatação e encontre o item Modelo de Postagem. Agora cole o seguinte código: ) . mas eu não entendi que código é esse????? me responde ok . claudinho.amigos.777@hotmail.com.br
alguem sabe como deixar so o nome da postagem como nesse site aqui http://www.agaleradodownload.com
por favor quem souber entre em contato comigo flww
rai_siqueira@live.com
Muito massa esse hack
http://www.firedownloadss.blogspot.com
Uso esse hack a bastante tempo, continuo usando, mas ele tem um bug no chrome.
eu nao consegui achar o codigo post-body
Não deu erro em nada, mais também nao funcionou! rs
eu nao consegui achar o codigo post-body 11313x
Não tem no template do meu blog, e agora?
Sou Guto de Sta Cruz do Capibaribe PE.
Legal o geito que vc encina, Pra Mim deu tudo serto,
Não erei nadinha.
esse hack é muito bom, pemite que vc deixe o blog mais organizado deixando as postagens do mesmo tamanho na pagina inicial (refiro-me a altura das mesmas, como se fosse um pdrão entende?)e o blog carrega bem mais rapido.
fiz tudo certinho mas nao funcionou !
fiz tudo certinho mas nao funcionou ! ²
fiz tudo certinho mas nao funcionou ! 3
Muito bom, vou testar estava procura há muito tempo!!!
muito bom icebreaker, parabéns, tem como ensinar a fazer isso, mais colocando uma imagem, no lugar do Leia Mais... ?
acabei d aprender sozinho, eita mto lokoo isso
Não consegui encontrar os dois últimos códigos, os tinha que substituir, no HTML.
Aew, não consegui encontrar div class='post-body'. Alguém pode ajudar-me?
Acho que consegui: data:post.body
AAAAhhh, esquecem tudo o que disse. Cliquem em expandir modelos de widgets.