Os tutoriais e templates aqui apresentados são voltados para os Modelos de layout (lançados em 2006). A eficácia das dicas aqui apresentadas não foram testadas nos novos modelos de templates do Blogger (2010).

03 setembro 2008

Hack Leia Mais Resumo de Postagem

Se você deseja apresentar apenas um resumo de sua postagem com um link do tipo 'Leia Mais...' ou 'Continue Lendo..." em seu blog, siga estes passos:

Vá ao HTML do seu blog e antes da tag < /head >, cole este código:

<b:if cond='data:blog.pageType != "item"'>
<script type="text/javascript">

var fade = false;
function showFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
for (var i = 0; i &lt; spans.length; i++) {
if (spans[i].id == "fullpost") {
if (fade) {
spans[i].style.background = peekaboo_bgcolor;
Effect.Appear(spans[i]);
} else spans[i].style.display = 'inline';
}
if (spans[i].id == "showlink")
spans[i].style.display = 'none';
if (spans[i].id == "hidelink")
spans[i].style.display = 'inline';
}
}


function hideFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
for (var i = 0; i &lt; spans.length; i++) {
if (spans[i].id == "fullpost") {
if (fade) {
spans[i].style.background = peekaboo_bgcolor;
Effect.Fade(spans[i]);
} else spans[i].style.display = 'none';
}
if (spans[i].id == "showlink")
spans[i].style.display = 'inline';
if (spans[i].id == "hidelink")
spans[i].style.display = 'none';
}
post.scrollIntoView(true);
}

function checkFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
var found = 0;
for (var i = 0; i &lt; spans.length; i++) {
if (spans[i].id == "fullpost") {
spans[i].style.display = 'none';
found = 1;
}
if ((spans[i].id == "showlink") &amp;&amp; (found == 0))
spans[i].style.display = 'none';
}
}

</script>
</b:if>

Salve o template. Depois clique em Expandir Modelo de Widget e procure este trecho:

<div class='post-body'>
<p><data:post.body/></p>

Substitua-o 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>
<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>

Salve. Agora em em Configurações->Formatação-> e desça a página até ver Modelo de Postagem. Cole alí o seguinte código:

Digite aqui o resumo do post
<span id="fullpost">
Digite aqui o resto do post
</span>

Salve. Toda vez que você iniciar uma postagem este código aparecerá (melhor visualizado no modo HTML da postagem) e basta que você respeite os campos correspondentes para o resumo e o restante da postagem. Se não desejar resumir um determindo post, basta apagar o código.

Este artigo foi completamente refeito em 19 de novembro de 2008, pois o código anterior que aqui se encontrava não funcionava perfeitamente. Ao contrário, este que coloquei agora, funciona 100%. 

Artigos Relacionados

171 comentários:

Adriano Cunha disse...

Oi... bom sempre entro no seu blog, e adoro ele, gostaria de tirar uma grande dúvida, é póssivel eu fazer um site pelo blogspot, com vários blogs, sendo que tenha um principal e outros que redireciono.

Com um dominio e se precisaria de hospedagem e de que tipo.

Ficaria muito grato, com sua ajuda!

ObrigadO!

*Mascote* disse...

Olá! tudo bem?!

Eu já tive um template que tirei aqui do seu blog o nome era v'mour... No entanto, acabei por o perder e agr tornei a vir aqui para pegar de novo o codigo mas não o encontro :(

Será que me podia mandar o código por mail? Queria mesmo mt esse template...


O meu mail é: mascote82@gmail.com


Bjinhx e obrigada desde já***

*Mascote* disse...

Aro, again!!

Dps de explicares isso podias explicar como se passa um tema do worldpress para blogger?!

Gosto bastante deste tema mas n tem código para blogger:(

http://test.wpthemesfree.com/?preview_theme=soft-love

Rogério Macedo disse...

Ariane, eu tentei do seu mode e não funcionou, fiz de outra maneira, se quiser eu te passo por email.

Abraços.

Thiago Adm disse...

Olá!!!
o código ta dando erro no meu blog
eles dizem que a formatação é inadequada
e eu presciso muito pois to com umas
matérias muito grandes!

se puder me ajudar de alguma forma agradeço
quase tudo que aprendi foi aqui e no Dicas
para Blog onde vi um podcast com tigo

não tenho mais outra fonte de ajuda!!!

obrigado desde já pelo blog para blogs!!!
meu e-mail é movercristao@hotmail.com
e o blog movercristao.blogspot.com

Ariane disse...

Rogério, Thiago, como podem ver, estou usando aqui no blog e não deu erro nenhum.sem nenhum erro.

YaCastro disse...

Tmb tive problemas, aparece assim quando eu clico para visualizar antes de salvar:

"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: Open quote is expected for attribute "{1}" associated with an element type "cond"."

quando aparece isso eu paro na hora..
Como eu faço? Dos hacks que eu vi de "leia mais" o seu é o menor . Praticamente todos que ue testei dão erro.. to desde onten tentando! :(

Juliana Freitas disse...

Ariane, querida, aqui também não deu certo... Tô usando o template do Compulsivo, e apareceu a seguinte mensagem: "Mensagem de erro em XML: Open quote is expected for attribute "{1}" associated with an element type "cond"."
JKá tentei de tudo e não funcionou! Será que não rola? Beijocas!

fatheroes disse...

Oi Ariane, tudo bem?

Por acaso, depois que eu implementar esse "leia mais", se eu ao fazer uma postagem, remover o texto (código) que já virá do Modelo de Postagem, não tem problema né? Vai aparecer todo o texto normal? E o link do "leia mais" tb some?

Não sei se compliquei ou expliquei minha dúvida, hehe.

Abraços.

Ariane disse...

fatheroes, na verdade...testei em um dos meus blogs e o link aparece mesmo quando apago o código, ou seja, mesmo sem resumir a postagem, no final o link Leia Mais...aparece. Vou tentar descobrir uma maneira de sumir com ele qdo não for necessário.

Arkanoidblue disse...

To tentando aqui,na postagem principal, aparece o Leia mais...

Porem no secundario não apareçe o que escrevi. Poderia me dar uma ajuda.
A proposito, parabens pela dica.

Rogério Macedo disse...

Eu já havia corrigido o problema das aspas, o que aconteceu depois foram os posts sem as tags sumirem.

Dalton Vieira disse...

Olá Ariane,

Primeiramente gostaria de agradecer pelo trabalho e conteúdo apresentado no seu blog, no da Juliana (DicasBlogger) e do Compulsivo (UsuarioCompulsivo). A mudança do layout do meu blog foi baseada nos ensinamentos e idéias para o blogger apresentada por vocês. Muito obrigado!

Em segundo gostaria de apresentar a solução para o problema de ficar aparecendo o Leia mais... nos posts antigos do blog, que não tem o uso deste hack.

Infelizmente não conseguir colocar a solução aqui. "Seu HTML não pode ser aceito: PHP, ASP, and other server-side scripting is not allowed."

Como posso enviar a solução para você?

Grande abraço.
Dalton Vieira

nanieateologia disse...

Ariane,
É extremamente necessário q eu te dê aqui os parabéns!
Passei anteriormente por uns 3 blogs e a instalação sempre tinha erros: no código, ou duplicação do post, ou não aparecia o "leia mais".
Mas o seu, logo de primeira, deu certíssimo!
Agora fico aguardando a resolução da questão levantada pelo fatheroes.
Obrigada!

YaCastro disse...

È agora funcionou... mas tem ainda esse probleminha de parecer o leia mais em todas as postagens.

Me tire uma dúvida boba, como faço para resumir postagens já publicadas?

To com hack funcioando no blog teste já... quando tiver 100% passo pro meu blog normal!

Bjoos
:)

Alexandre Brendim disse...

Bem legal o blog. Estou começando com meu blog e já achei várias dicas que vou utilizar.

Parabéns pelo blog

Renan V. Ferreira disse...

esse poste ja tinha sido postado no blog
http://templatesparavoce.blogspot.com/2008/03/posts-expandveis.html

Ariane disse...

Renan, vc leu as duas postagens? Acredito fortemente que não ou não teria feito este comentário.

nanieateologia disse...

Ariane,
Ao errar a configuração de um artigo, pode ser que eu tenha conseguido tirar o "Leia mais" em postagens visualizadas completamente na página principal.
Fiz alguns testes posteriores e funcionou comigo.
Por favor, veja se daria certo para vc tb: ao invés de no final do artigo colocar /span, coloquei span class="fullpost". E não coloquei /span em nenhum lugar.
Espero que seja esta a solução do problema.
Abraços!

nanieateologia disse...

Ariane,
Fico realmente muito feliz que meu erro em um post tenha se tornado a solução de um problema para todos.
Obrigada pelo link!
Abraços...

Dr. Spock disse...

Olá Ariane, como vai? Antes de mais nada fica aqui o meu elogio ao seu blog que é excelente e traz dicas valiosíssimas pra quem quer otimizar o seu blog, não somente com novos templates. Eu inclusive, já utilizei um template criado por vc, mas com algumas modificaçoes.

Bom, vamos a uma dúvida (corri por todos os comentários pra ver se isso ocorreu com alguém, mas pelo jeito não): a local onde eu coloco o título do post simplesmente sumiu após eu implementar o código!!! Ainda bem que testei em um blog de testes antes de implementar no meu blog normal!

Mas fica ai a minha dúvida! Teria isso uma solução?

Desde já agradeço a atenção!

Ariane disse...

Dr.Spock, eu tenho que ver o código colocado e seu perfil nem está disponível

Matheus, Jô e Sylvia disse...

Oi Ariane, tudo bem?
Preciso de uma dica sua, pois o código funcionou muito bem, mas no último post da página principal, a janela que abre não passa as margens inferiores da janela de postagens.
Não tem como ler.
E se a postagens anterior for um vídeo do youtube, a janela fica por trás do vídeo, impossibilitando a leitura.
Dois probleminhas pequenos, conto com sua dica...
Desculpe-me se estas dúvidas já foram respondidas em outro tutorial, mas procurei e não encontrei.
Deus te abençoe...
Matheus

Ariane disse...

Matheus, pelo que ví vc já mudou o código

Matheus, Jô e Sylvia disse...

Desculpe ariane, é verdade...
alterei o código pelo do Renan no templates prá você...
Ainda acho que o código antigo era mais elegante pois abria uma janela tipo pop-up com fundo diferente, mas acho que não fechou com o template do que estou usando.
Mesmo assim te agradeço ...
até a próxima dúvida.
Matheus

Paulo Victor disse...

Ariane... adorei essa dica e até vou usar em meu blog.. só queria saber uma coisa...

nas minhas postagens antigas, bem antigas mesmo, tb aparece o Leia +, mas só quero colocar o leia mais... nos novos posts que eu faço...

sevc souber como faço pra mudar isso, ajudaria muito...

ah, e deixo aqui o endereço do meu blog. Outra coisa, mesmo esse naum sendo o post certo para isso: naum consigo colocar os comentarios usando o OpenID. quando pede o nome de usuario e senha diz que ta errado, sempre. Se puder me ajudar, agradeceria muitissimo..
http://www.seriadosnopc.blogspot.com


bjus pra ti ariane! sucesso!

Presidente disse...

Oi...
Nao sei por qual razao, mas o leia mais fica muito longe do texto ! tipo quase o tamanho do proprio texto. O que posso fazer ?

supergang disse...

NÃO CONSEGUI. SÓ MENSAGEM DE ERRO

supergang disse...

não consigo!!
esse LEIA MAIS não sai
ajuda

Rodrigo Gameiro disse...

Você esta de parabéns, adoro os conselhos que tem em seu blog e o do Usuario Compulsivo. deixo aqui meu GRANDE OBRIGADO.

Marcelo Soares - Arquivos Pessoais disse...

Amei essa dica. Muito obrigado porcompartilhar mais essa informação.

Um abraço.

Leo Suárez disse...

Oi Ariane, excelente dica, pena que no meu blog não consigo tirar o "leia mais" dos posts que eu quero inteiros. Já fiz o lance de deixar o span class="fullpost" no final sem o /span mas não funcionou, tentei outras maneiras e nada. Mas já é um caminho e o recurso é muito interessante e importante. Obrigado.

Rogério disse...

Oi Ariane,
Testei a dica do Compulsivo e deu super certo. Gosto dessa dica por qwue a coisa fica mais automatizada. Se alguém quiser testar vale a pena.

muitas-musicas disse...

Não consegui ...
aqui aparece o leia mais
mas o que eu puis dentro das tag não mudaram nada
aparece na pagina inicial do blog

supergang disse...

ninguém conseguiu

Daniel Hewson disse...

No meu houve um problema, e ainda sou inexperiente com blogs.

Aparece a seguinte mensagem:

"Mais de um item encontrado com o id: LinkList1. Os IDs de itens devem ser únicos e exclusivos."

Gostaria de saber onde está o erro, e como eu poderia consertá-lo.

Obrigado!

ps.: Me tornei visitante assíduo do blog. Além de útil é extremamente simpático. o/

meu e-mail:

daniel.sloth@gmail.com

Ariane disse...

Daniel, esta mensagem que apareceu não tem nada a ver com a implementação do hack 'leia mais'. A mensagem apareceu pq vc tinha duas widgets nomeadas LinkList1, é preciso mudar um deles para LinkList2, por exemplo.

supergang disse...

DESISTO

Ariane disse...

supergang, vi seu blog de testes e o link está funcionando.

supergang disse...

Ariane,
funciona perfeitamente. O problema é que eu quero que o Leia mais... desapareça e eu não consigo.

Ariane disse...

supergang, eu dei uma editada na postagem. No último parágrafo, em Atenção! aconselho a retirar o último código de Modelo de Postagem e usar somente nos posts que se deseja resumir.

ADM César Andrade disse...

Oi Ariane, Gostaria de Saber se existe possibilidade de que você poste um tutorial ensinando a resumir postagens mas no estilo desses sites: www.centralexpert.net & www.clubedoparente.com, Por Favor!

Ariane disse...

ADM, desculpe, mas não encontrei resumo em nenhum dos dois blogs.

BorisXp disse...

me desculpe, mas ta dando erro no meu blog, quando vou vizualizar, ele duplica os posts, o que é isso. tentei em um outro blog deu certo, mas no meu os posts sao duplicados.

mundodegame.net

ADM César Andrade disse...

É Por isso que eu quero... haha.. vou tentar explicar, é assim: se você entrar em qualquer um desses blogs verá que tem um botão de DOWNLOAD que ao invés de redirecionar direto a pagina de download share (rapid-share, 4shared etc..) ele vai ao link da postagem, ou seja logo depois que você clica, irá a pagina da postagem, e lá consequentemente terá o mesmo botão mas, com o link direto ao download.
Espero que tenha dado pra entender.. Obrigado desde já! =P

Administrador disse...

Olá Ariane,

No meu HTML não localizei o código (data post.body)

Como resolver o problema?

Posso incluí-lo? Onde?

Desde já agradeço,

Parabéns pelo blog!

Neto Fedozzi disse...

Oie
muito boa postagem, aqui funcionou perfeitamente, mas mesmo incluindo o código "verde" só nas postagens que quero resumir, o Leia mais está aparecendo em todas, como faço pra retirar isso?
obrigado desde já!

Neto Fedozzi disse...

agora ficou mesmo perfeito, funcionalidade de 100%, tá de parabéns mesmo.
até mais

Juninho Cobra disse...

Funciona bem mesmo !! Estava penando com isso a muito tempo, mudei meu Template essa semana e na hora que eu fui colocar o código ... Bummm, deu pau ! Até que achei Vcs e tudo ficou uma maravilha .. Obrigado e muito Sucesso

RENDA EXTRA REAL disse...

Bom dia,

Ariane, eu coloquei o código antigo, sendo que ficou aparecendo o leia mais, mesmo nas postagens que não foram resumidas, apesar do problema deixei o código, pois as minhas postagens são grandes e optei por resumir todas e ficou tudo certo.

Quero colocar esse código novo, porém tenho uma dúvida: se colocar esse código novo, as postagens que estão com o antigo código vão continuar funcionando normalmente ou vou ter que refazer todas? As postagens com o código antigo continuarão funcionando normalmente e a partir do momento que fizer novas postagens e já tendo colocado o novo código, ele funcionará apenas com as novas postagens, é dessa forma? Estou confusa...

Ariane disse...

renda extra, o problema é que antes era span class=fullpost e agora é spand id=fullpost. vc teria q fazer essa modificação em todas as postagens ja resumidas; apagar o class e substituir por id, ficando assim:
<spand id='fullpost'>

Marcelo Soares - Arquivos Pessoais disse...

Prezada Ariane,

Segui todos os passos que você indicou. Funcionou muito bem, no entanto, em algumas postagens fica um espaço muito grande entre as postagens. Você sabe como resolver isso?
Confira:
http://alzenirsacramento.blogspot.com/

Ariane disse...

Marcelo, dei uma olhada nas postagens e vi que aparece o código span class=fullpost (deveria ser span id=fullpost) e tbem está aparecendo um monte de vezes em cada postagem. Da´uma olhada no post no modo html e vê qtas vezes está se repetindo.

Leco Leite disse...

Comigo funcionou no meu blog de teste, mas eu queria se dá pra abrir o resto do texto na mesma página, ao invés de abrir em uma nova página...

Quando clicar, o texto apenas aparecer abaixo.

Tem como fazer isso!?

Obrigado e abraço!

Ariane disse...

Leco, este efeito vc consegue usando outro código, q não tenho aqui no meu blog. vou pesquisar, abraços

RENDA EXTRA REAL disse...

Bom dia,

Ariane, coloquei o código novo e refiz todas as postagens, agora está perfeito, 100%.

Muito obrigada.

Abraços,

Maria C Rodrigues

Douglas disse...

eu coloquei um outro codigo pra resumir
gostaria de saber se ainda tem como eu colocar esse pois oq eu coloquei sempre resume eu querendo eu não e tem determinados posts q eu não quero resumir

Ariane disse...

Douglas, tem sim. Lembra que mandei colar um código no lugar de:

<div class='post-body'>
<p><data:post.body/></p>

apaga e cola o código que explico aqui nesse tutorial

Douglas disse...

consegui vle pela ajuda
e otimo blog ja me ajudou muito
criei meu blog a uma semana
e ainda to apredendo a mexer =)

Leco Leite disse...

Ok, Ariane... eu tenho procurado mas não encontrei ainda.

Valeu pela ajuda e espero por esse código aqui tbm!!

Abraço!!

Jujubiz disse...

Olá! Adoro o seu blog, cheio de coisas práticas e várias dicas... Muitas delas também já usei no meu, hehehehe... Enfim, sei que não tem nada a ver com esse teu post, mas eu tenho uma duvida. Se eu quiser colocar uma borda (uma linha) ao redor de um widget, como eu faço??? Não achei essa dica aqui no seu blog, só achei sobre colocar borda em imagens... Enfim, parabéns pelo site, está ótimo! Espero uma resposta xDD Beijão!!!

cult-space disse...

Oi, Ariane!
Muito Obrigada, finalmente consegui colocar um
link "Leia Mais" que é 100% perfeito.
Havia colocado antes, os códigos que o próprio Blogger recomendava, mas o bendito (Leia Mais)aparecia em todas as postagens, mesmo naquelas em que não havia necessidade.Tipo automático, sabe?
Com o código que vc sugeriu...hahahah Resolvido.
Estou muito feliz.Obrigada mesmo.Bjo

Felipe_Dias disse...

Muito obrigado pelo hack
só dessa vez eu achei ele bem explicado

só que quando eu boto ele tenho que deletar o codigo que faz mostrar o autor do post

não tem como juntar o hack com o codigo junto?

só pra deixar claro, to usando o template digg que tem aqui no blog

vlw!!

Tássio Menezes disse...

Oi Ariane!

Colquei o link "Leia mais" conforme explicado aqui no post, porém a segunda parte não fica como "leia mais", aparece tudo na íntegra e também o link, que quando clicado aparece a mesma coisa que está no post. Poderia me orientar?
Agradeço

Ducampos disse...

Boa Noite,
Ariane não consigo achar o codigos

< div class= 'post-body '>
< p >< data:post.body /> < /p>

como posso resvolver esse erro ?

obrigado

- milla disse...

Tenho o mesmo problema que o Ducampos falou, acima. Já mandei até a barra google procurar. De fato não tem no meu layout. ><

E seu blog tá de parabéns. (:

Cidão disse...

Tive o mesmo problema que o Ducampos e a - milla

Ariane disse...

Ducampos, no seu blog está <div class='post-body entry-content'>

milla, no seu está exatamente como mostro no tutorial. barra do google? vc usou o Ctrl+F?

Cidão, seu template é uma conversão do wordpress, por isso está diferente. vc tem q procurar a div q está relacionada ao post para fazer a modificação, me parece q é <blog-posts> mas olhei só por cima, precisa investigar melhor.

- milla disse...

Ah, mas não seria pro meu blog, no caso. Seria pra um outro. Esse aqui: http://oescavador.blogspot.com

E sim, aquela função que a barrinha do google oferece de destacar na página os termos que eu pedir.

Ariane disse...

milla, desconheço a função para este fim, eu uso o firebug ou o ctrl+F. vi o blog e lá contém o código como está descrito no tutorial.

Marc disse...

Na versão antiga do meu blog não estava funcionando, mas agora que você ajeitou enfim após alguns meses sem resumo terei alivio, muito bom, obrigado Ariane ;)

Felipe_Dias disse...

e a minha pergunta?

Caio disse...

voce é FODAAA... sem outras palavras

César Aquino Ministro disse...

Oi Ariane!
Marquei em expandir modelo, e Ctrl+f, mas não encontrei o trecho que vocÊ digitou.
Poderia me ajudar?

Yumi disse...

Olá Ariane, estou comecando um blog agora..tentei fazer o que vc ensina no tutorial,mas na segunda parte onde devo trocar as duas linhas,depois de colocar o codigo que vc passou eu vou salvar e

dá esse erro : "The element type "b:includable" must be terminated by the matching end-tag "".

O que devo fazer??

Obrigada

Junho disse...

Obrigado Ariane fique muito tempo para conseguir aplicar este hack no meu blog tentei muitos mas nunca consegui achei o seu link no meus favoritos e tentei e consegui.
Thank You

celebraii disse...

Olá Ariane,

Quando copio algum post; a segunda parte fica bem minuscula quando dou algum espaço entre linhas, o que poderia estar errado?

Aguardo,

Muito obrigado!

Will

Juka disse...

boa dica, eu conseguo só qnd eu escrevo mas qnd coloco imagem e quero deixar algumas imagens no "leia mais" eu não consigo, fica aparecendo na pagina inicial todas as imagens sendo que quero somente algumas. como faço?

Thiago Luan Bessa Martins disse...

Ariane o hack é muito bom parabéns, mas sabe se tem algum jeito de estabelecer um numero de caracteres para aparecer na pagina inicial?

to querendo isso pq alguns dos membros dos meus blogs nao sabem lidar com codigo no meio da postagem, são muito mais zerados que eu ehehehhe

eu ate tentei o do Usuario Compulsivo mas o codigo dele não funciona bem não pega na IE e no fire fox ele funciona com falhas primeiro aparece o post inteiro e lav uns sgeundos para resumir e em alguns casos nem resume

agraço se poder me ajudar

Eloiza Nogueira disse...

Olá Áurea,
Li sua entrevista no Blogsfera, fiquei surpresa em saber que este blog sé tem 1 ano e 3 meses, não sei quando vc começou se envolver com estas novas linguagens, html, css, etc mais sei que vc desenvolveu e muito. Estou tentando tateando aqui e ali, mais sei vai demorar um pouco.
Por favor me socorre, consegui fazer um arquivo em Gif no programa Foto Skape, mas quando posto o referido programa ele fica estático, não há mudança de fotos. Quero colocar estas imagens, isto é já coloquei, no cabeçalho do meu blog http://caparao.blogspot.com.
Como devo proceder?
Parabéns pelos seus blogs, eles tem me ajudado muito.
Muito Obrigada por tudo.

Ariane disse...

Eloiza, vc errou de blog, aqui é o blog da Ariane :) De qualquer maneira, para fazer um gif animado funcionar, vc não pode hospedar ele no blogger, deve hospedar em outro site, como o Tinypic e colocar o link fornecido direto no código do template, assim:

#header{
background: url(link da imagem) no -repeat top left;

Marcos disse...

Ei Ariane,
conheci seu blog há pouco e já estou usufruindo da sua tão caridosa ajuda.

Ainda não tinha conseguido colocar o tão querido "Leia mais... "
Mas agora finalmente com sua ajuda eu consegui.

Deus lhe abençoe.

Marcos disse...

Ei Ariane, conheci seu blog há pouco e já estou usufruindo dele.
Finalmente consegui colocar o bendito "Leia mais..." com sua caridosa ajuda.

Deus lhe abençoe.

Chau ... chau...

recicled disse...

Muito bom....Ariane ja implementei esse codigo no meu blog,queria agradecer pela ajuda ja que fiz o meu template baseando-se nas suas dicas ealguns hacks do usuario compulsivo

Edu Personal Training disse...

ola !!!
eu segui os passos direitinho !
ele resume os posts mas não controla quais os posts que eu quero na primeira pagina ! gostaria de colocar apenas os resumidos !

alem disso no mozila ele funciona 100%
mas na merda do internet explorer tenho um post que tem imagens e colunas divididas e ele coloco o que eu resumi e algumas coisas a mais fico um resumo mo loco !
pode me ajudar ?

vlw !

aa adorei as dicas !
http://edupersonaltraining.blogspot.com/

Edu Personal Training disse...

vish ! foi mal pelo link do meu blog !!!
ainda sou novo com relação a blog e fico meio perdido rs...

vou postar de novo !

segui os passos direitinho !
ele resume os posts que eu quero e deixa sem resumir os que não quero.
mas eu gostaria de por apenas os posts resumidos na pagina inicial sem ter que controlar eles pelo numero de posts !!!

alem disso no mozilla está 100%.
mas no internet explorer o post que tenho com imagens e colunas dividida fico mo loco !
pode me ajudar a resolver isso ?
obrigado.

Winicyus Nolêto disse...

Olá,

O codigo é ótimo e funcionou bem.

Mas gostaria de saber se tem como ao clicar em "Leia mais" o post abri na propria página. Pq como está ai ele abre outro página só com o post. Queria q ele apenas expandisse onde ele está sem abri em outra página.

Edu Personal Training disse...

Sem ajuda !!!
que triste !

Chadi disse...

Ótima dica!!!
parabesn pelo seu blog, leio sempre e sempre ele resolve tudo oq preciso!
;)

Leonardo disse...

Obrigado Ariana, faço as configurações do meu blog sempre por aqui !

DanieL Moreno disse...

Ok, estou com problemas. Copio o primeiro código e salvo tudo certinho. Depois expando os widgets e vou tentar salvar o código daqui. Primeiro que aparece (div class='post-body entry-content') no lugar de só (div class='post-body'). Daí eu apago esse juntamente com o (p)(data:post.body/)(/p) que, pra mim, só aparece como (data:post.body/). Então subtituo pelo código que você dá. Quando clico pra salvar, abre uma página de erro do Blogger, pedindo que eu anote o código do meu erro e envie pra eles, informando este código e o que eu fazia no momento que deu o erro, ou então que eu procure pelos grupos de discussão do Google se há algum comentário à respeito desse código de erro.
O que tô fazendo de errado?

PS: substitua os parênteses por "<" ou ">".

Dani disse...

Eu estou com o mesmo problema Daniel... Já tentei de todo jeito e nao consegui nada!

jheison disse...

Preciso de ajuda...

Eu consegui fazer tudo perfeitamente...

Ta tudo certinho...

Mais eu gosto de colocar imagens no post, mais naun consigo colocar a imagem na parte de baixo (em leia+)... a imagem sempre sobe para parte de cima, eu queria que a imagem ficasse junto com o restante da postagem, oculta, só quando o leitor apertassem em “leia +” que a imagem e o restante do post aparecessem...


COMO EU FAÇO ISSO?

Ariane disse...

Daniel, Dani, esta mensagem de erro geralmente aparece qdo estamos fazendo várias modificações no código em poucas horas. Limpe o cache do navegador e tente novamente.

jheison, coloque a imagem normalmente no post e qdo terminar de escrever, clique em Editar HTML (no post mesmo), copie e recorte todo o código referente a imagem e cole no local onde quer que apareça.

Marcelo Dantas disse...

Ariane muito obrigado. No meu blog funcionou perfeitamente. Eu não sei o que seria da blogosfera sem vc.

No meu blog não havia o código completo:

div class='post-body
data:post.body

Então eu achei um código que parecia com a linha de baixo e em cime havia algo parecido com post-entry

Então eu sbtitui por estas duas linhas e deu certo. Obrigado

Ruy disse...

no meu caso o " leia mais' sempre aparece, mesmo que o texto nao possua resumo de postagem, há como resolver isso? ou seja, fazer com que o botão leia mais só apareça quendo for requerido?

Igreja Centenario disse...

pois bem lendo todo o comentario... vi que o seu cod adrino era um pouco diferente do meu.. pois tinha uma pequena formatação de xml..

fikei procurando algo parecido com o codico acima..
pois sei um pouco de html

achei o codico.....e consegui chegar no meu objetivo obrigado por ter um bloger com qualidade.....

Mercados e Ações disse...

Tem uma maneira de manter o adsense, uma vez que esta mudança impede de colocar o códogo adsense embutido no post?

lrdpckrd disse...

Ariane a tua dica resolveu o meu problema. Gostava era de uma dica para que o que eu escrevesse como sendo o resumo do post não aparecesse depois de eu carregar no "Leia Mais". É um código completamente diferente ou dá para adaptar este?

Cumprimentos
http://morganho.blogspot.com/

Samuka disse...

aeeeee
esse é bem melhor do que resumir tudo pq quando resume tudo e coloca um limite de caracteres maior um pouco e vc posta um artigo pequena, ainda fica o link la para continuar lendo...

vlw

Júnior Lima disse...

No meu nao deu certo. da erro

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 "b:includable" must be terminated by the matching end-tag "".

Adelson Smania disse...

Olá, Ariane!

Vim aqui só agradecer pelo código. Já o coloquei em meus blogs e o visual ficou ótimo.

Obrigado e parabéns pelo seu trabalho!

Tássio Menezes disse...

Ariane está aparecendo a seguinde 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 "
".

O que devo fazer?

*´¯`* Daniel Ikeda *´¯`* disse...

Acredito que algumas pessoas terão o mesmo problame que o meu.

entrei na edição do leia mais e pesquisei:

<div class='post-body'>
<p><data:post.body/></p>

porém não o encontrei, caçando um pouco descobri que no meu estava com o seguinte:

<div class='entry'>
<p><data:post.body/></p>

===========================================
Pessoal, localize esta parte pelo seguinte (caso acontecer igual):

data:post.body

Dai modifiquem a class, não só o nome como no css tbm, localizem e mudem o nome para o mesmo do artigo de nossa amiga. mais detalhes falar comigo ou com nossa amiga

downloadsemcontrole.com disse...

muito bom esse que estava precisando VLW

Jardel9090 disse...

Gente Não Conseguii mii ajuda
add no msn jardel_walter@hotmail.com
Por favor ajudeme algum moderador dakii,
to precisando muiiito diisso

Myrianna Coeli disse...

Olá. Muito bom este blog!!
Tentei fazer isso no meu blog, mas quando clico em leia mais o blog é redirecionado pra outra página, onde deveria ter o restante do texto , mas o resto do post não aparece, a página fica sem nada.
Se puder me ajudar, meu e-mail é: myri.coeli@gmail.com
bjs

rujansom disse...

Olá sou o André com o apelido de rujansom quero saber como ajeito o defeito,que quando eu vou adicionar uma imagem no meu post a imagem não unciona meu blog é no blogger

Salvador disse...

Muito obrigado, reconheço que este foi tutorial que mais trouxe retorno para o meu blog. Parabéns pelo post e pelo blog, continue assim. Eu testei vários métodos, mas esté foi o unico que deu certo, pois como foi dito está é uma versão atualizada.

Paulo Salvador
http://urubuzeiro.blogspot.com/

Juliano disse...

legal deu certin abrass

alberodoro disse...

Caramba! Deu trabalho mas consegui. É que eu já havia fuçado muuito no template, e algumas coisas estavam diferentes da sua descrição, mas deu certo.
No meu blog de ficou bem bonitinho, o principal ainda não apliquei.

Obrigado linda!

Tandder L. disse...

Obrigado! :D

Liandro Silva disse...

Ariane, me ajuda meu blog ficou doido ele mostra as postagens aque ja tinha duplicadas oq devo fazer....

Liandro Silva disse...

Então Ariane eu coloquei ontem um comentário pedindo ajuda pq meus posts tinham ficado duplicados após a implementação. Esse problema ja resilvi, minha dúvida agora é com relação ao seguinte, apliquei tudo seguindo os passos exigidos e quando fui criar uma nova postagem aparece a marcação digite aqui o resumo e talss, digitei o resumo na parte dele e o restante na outra parte.
Porém qando eu fui salvar deu uma msg de erro no HTML. Marquei a opção não mostrar erro e publiquei a postagne. Acho que iso foi o erro a postagem não ficou dividida..

vc poderia me auxiliar gostei muito desse formato tenho uns artigos muito grande para postar e preciso que esse hack funcione, Obrigado e parabéns...

Ariane disse...

Liandro, a melhor maneira de usar esse hack é escrevendo o post no modo Ediatr HTML, pra vc ver bem claro o incio e o final de cada tag, ok?

Liandro Silva disse...

Ariane muito obrigado pela dica, eu consegui resolver funçando mesmo, blogueiro de 1ª viagem rsrsr...
Mas deu tudo certo ficou perfeito, ainda bem que sou brasileiro e não desito nunca,,,,

ajusteofoco disse...

MUITO obrigada, Ariane! Eu já havia testado outros códigos que não funcionaram, e o seu finalmente funcionou \o/

Ellen

Angelo Moraes disse...

Boa noite Ariane,em primeiro lugar Parabéns pelo excelente blog que você tem.
Bom, esse hack é fora do serio, mais não sei o que acontece no meu blog, adicioneio o código corretamente, mais depois ao abrir no IE, aparece "O Internet Explorer não pode abrir o site da internet" OPERAÇÃO NULA...

Acho que é o lixo do meu templates, uso uma versão do MINIMA com três colunas, porém foi um amigo que me passou o código, funcionar até funciona, mais aos trancos e barranco, acho que por isso o código não funciona no meu blog, meu blog possui um conteúdo muito extenso, portanto tem matérias que são enormes estou precisando dessa ferramenta, mais até agora nada... O IE..."IIII ERREI" de novo está complicando tudo, gostaria de obter mais informações, aonde posso estar errando, o código é inserido sem problema mais o resultado final não é nada satisfatório...

Meu blog é www.turmadopetroleo.info

Desde já muito obrigado,
Aguardo respostas,
Atenciosamente Angelo Moraes.

Angelo Moraes disse...

Ariane você é sensacional...Uma dica melhor que outra, sou seu fã de carteirinha...

Forte abraço,

Atenciosamente Angelo Moraes.

net-ativa disse...

Salvou minha vida *-*
Obrigado

Cledson disse...

Ariane da pra por uma FOTO no lugar do link ?


Como ?

Obrigado

Ariane disse...

Cledson, no lugar de Leia Mais...coloque o seguinte código:

<img src='url da imagem'/>

Miya disse...

Oii! eu nao consigo achar o codigo no meu template quando expando o modelo de widget.. O que posso fazer?? obrigada

Bia disse...

Gostei! Cheguei a testar outros códigos, só que resumiam todos as postagens... achei este mais legal pela opção de resumir só o que eu quiser!
Obrigada!

joao vitor disse...

e ae eu fiz um blog com a minha evoluição no jogo
sou jovem.
e não entendi o primeiro código aonde é para colar ?

grandweb disse...

Olá!!
Muito obrigado por postar isso aqui, quando vi isso em outro blog, não estava dando certo, mas aqui deu tudo certinho. Testei no meu blog de teste.
Ah... E parabéns pelo blog

Fabricio disse...

Aqui não funcionou...

Ariane disse...

Fabricio, o código só não funciona se for colocado de maneira errada. Verifiquei seu blog e não encontrei lá o código para detectar o possível erro.

Willian disse...

olá!

estou atras deste codigo mas nenhum site me deu uma resposta que eu desejava então eu vim atras de você (pq vc sempre me responde:P)
eu queria esse hack , mas que quando o leitor clicasse no link (leia mais) a postagens se "expandisse" na propria página, sem ter que abrir uma nova pagina/ janela e muito menos leva-lo a outra pagina.

Será que você entendeu?

Flash disse...

Olá Ariane, eu estou atras do mesmo que o Willian.. um script que espandisse na mesma página, exemplo:

Ao clicar em "Leia Mais" ou "Continue lendo" o restantante do post ja aparecesse, sem ir para outra página... pois esse tem gente que tem net lenta e não há condições de ficar carregando página nova toda hora, então só compactaria o post, mas aao clicar no link só expandiria, sem mudar a página. Obrigado !

Ariane disse...

William, Flash olhem aqui: http://templatesparanovoblogger.blogspot.com/2009/02/template-black-e-mais-um-resumo-de.html

Free Poker Cash disse...

olá ariane
eu não acho o segundo código, o que deve ser substituido
como eu posso resolver isso?

obrigado

Sux disse...

Ah
Ariane
Eu vi aqui você falando pra um outro cara de um outro código, dai eu tentei ele e deu certo
mais os posts ficam assim:

"Inicio do post.

Leia mais... Inicio do post"

dai quando clica em "leia mais..." fica:

Inicio do Post

Fim do Post

Inicio do Post

Fim do post

Sabe como posso resolver isso??

Vlw

Willian disse...

0lá Ariane!

Fui eu que te fiz uma pergunta sobre o outro tipo de hack "leia mais" e primeiramente gostaria de agradecer a sua resposta (confesso que fiquei muito feliz quando vi que você já tinha a resposta XD) mas assim como o Sux, eu também tive problemas com o seu tutorial (que está um pouco confuso!)e na hora que vou escrever a postagem, ele só aparece o "Resumo do Post" e "Leia Mais". Depois, fui ver o código e vi que você deixou o "Resto do Post" em display:none. Mesmo quando apaguei esta parte(display...), ele continuou não funcionando. Será que consegue resolver isto?

Obrigado

Ariane disse...

William, me desculpe mas sou eu que estou achando confuso...vc me pediu um código para expandir na mesma página, eu indiquei. Agora eu realmente não sei de qual código vc está falando (se é desse aqui ou do outro tutorial). e quanto ao que o Sux escreveu, sinceramente, não entendi nada.

Willian disse...

Ariane, eu estou falando do outro hack (Template Black...)! Sei que estou comentando no lugar errado, mas quando vi que o "Sux" tinha comentado aqui, eu resolvi escrever aqui tbm! XD

Xaxeila disse...

Ariane do céu! Parabéns por ajudar as pessoas de graça e ainda aguentar essa ingratidão! Muitos reclamam que não conseguiram como se fosse sua obrigação resolver o problema de todo mundo! Que absurdo. Tive dificuldades em utilizar muitas das suas dicas, mas não sei o que seria de mim sem este seu blog. Estou aprendendo muito, quando tenho os dois neurônios acordados! Um abraço e um milhão de dólares virtuais para você.

xaxeila

JULIO disse...

Estou precisando usar este recurso mas não para um blog e sim para um site normal, como devo proceder ? grato.

Infinite disse...

Cara, meu Blog ele é meio diferente, ele não tem essa parte:

class='post-body'>
data:post.body/>

Apenas essa:

class='entry'>
data:post.body/>

OBS: Tirei uma parte do Código pra poder postar o comentário x]

Eu achei que daria no mesmo, mas quando vou salvar dá um Erro, o que devo fazer ? oO

Beauté et tout disse...

Olá! Fiz tudo direitinho, segui todos os passos e deu tudo certo. Só que desisti de colocar leia mais no meu blog ai quando fui e voltei para o outro código a palavra Laia mais não saiu...o que faço?
Atenciosamente,
Raquel.
oliveiraraquel4@gmail.com

Paraíba Percussiva disse...

Obrigado pela ajuda a nossa blogosfera. Deu certo comigo e foi muito fácil!!!

Maggot disse...

Oww,Vlw msm,Realmente Funciona!!

Mtu Grato :D

baixarjogos.blog.br disse...

Otima dica, fazia tempo que tava procurando por isto, obrigadão.

Jonatas Araujo disse...

valeu irmão esse foi o unico que funfou!!! :)

Macbeth disse...

Quando se usa esse efeito fica apenas nos posts que serão postados depois de inserir o código? Não tem uma maneira de usar o código em todas as postagens?

marilzagomes disse...

Alguém poderia me dizer como tirar o Hack leia Mais ou continue lendo?

Se alguém souber como por favor me envie um e-mail magz@marzam.com.br

Brenner Marinho. disse...

Olha queria fazer um Post hacker iqual desse site, tem com vcs me ajudarem ?

Site: http://www.emusic.com/artist/Israel-Vibration-MP3-Download/11488073.html

Clioke em more para vcs verem o resume post!

Ajude-me!

fernandomaker disse...

Poxa Ariane, eu consegui superar o problema anterior, mas agora o post tá duplicando! =/ O que eu devo fazer?

Eduardo Mozart de Oliveira disse...

Muito bom seu post! Estava procurando pelo "Leia Mais" a muito tempo MESMO! Havia tentado códigos JavaScripts, que não funcionavam. Seu post foi a minha salvação. Muito obrigado! Sucesso. ^^

kotonette disse...

Simplismente Excelente, muito obrigado. seu site é 10.

Fix disse...

Ariane,
Tava tudo certinho mas quando fui ver o que tinha colocado para ser na postagem resumo, repetia duas vezes, o que faço?

SkinTape disse...

Ariane, olá. Incansavelmente tento colocar os racks de resumo mas parece ser pirraça do template que eu escolhi. Tinha feito um experimento com o primeiro tutorial que ensinava só o basicão (resumo em lista só com títulos das postagens) mas agora coloquei o código que mostra imagens, e esse simples (em forma de lista) insiste em aparecer quando faço buscas. Achei estranho pq não tem mais o código dele no Templ. |8S Já mudei aparência do template, agora não sei o que fazer.

Ariane disse...

SkinTape você tem muitos blogs, em qual deles está o problema?

Educação Física Alagoas disse...

Gostei da sua ajuda :D

Solange Lutibergue disse...

Eu fiz tudo direitinho, coloquei os textos no local indicado na hora de postar, porém não deu certo.

O que eu fiz de errado?

Beijos.

Humor do NetoO disse...

Oi ariane, primeiramente parabéns pelo blog. Gostaia de tirar uma dúvida com você. Testei os códigos pelo Draft e funcionou normal. Até ai, ok!

Eu uso o windows live writer, para editar e publicar minhas postagens. Gostaria de sabe se esse código que coloquei em "Modelo de Postagen", poderia ser usado pelo Live Writer?

Obrigado!

punkrocker-4ever disse...

você conheçe algum tutorial que ensine a tirar insto?

DM2 Arquitetura disse...

Legal, adorei essa dica, mas tem um porém:

Executei tudo e funcionou certinho, porém quando eu adiciono fotos na postagem, elas ficam aparecendo no resumo, eu queria que apenas uma imagem aparecesse no resumo e as outreas aparecessem quando clicasse em "leia mais...", mas isso não acontece.

Yasmim disse...

consegui! Nossa, sempre quando preciso de algo venho aqui! é tudo tão explicadinho! obrigada! Beijos

C á s s i a disse...

Olá! eu consegui até a parte de escrever a postagem! =X
Quando eu vou postar aparece "Digite aqui o resumo do post Digite aqui o resto do post" certinho, mas quando eu escrevo onde é indicado, não da certo!

Será que alguem poderia me dar um exemplo de como se faz?
Obrigada!

C á s s i a disse...

A primeira parte eu consigo fazer direito. Mas depois eu não acho
div class='post-body'
p></p

O que eu faço?
Obrigada

Samantha disse...

Oi Ariane, seu blog é muuito bom - sempre visito pra pegar dicas. Mas há um problema - consigo fazer tudo q vc fala direitinho, menos achar a parte do "div class='post-body'"
'p''data:post.body/""/p" - eu até acho a primeira tag, mas a segunda não tem x_x E ai não consigo o efeito de resumir a postagem... "/

Pode ajeitar isso pra mim? '-'
Bjos e feliz ano novo. ^^

Liana disse...

Oláaa!!
Estou com um problema com postagens resumidas!!!Uso um recurso que resume automaticamente a postagem sem ter que colocar esses codigos em cada uma dela.
Só que esse recurso não funciona nas paginas estáticas!!
Você sabe me dizer como resolver isso?
Na página estatica ele resume mas trava a postagem!!!
Se puder me ajudar: lianacgn@yahoo.com.br

Ariane disse...

Liana é preciso usar uma condicional para impedir que o código funcione nas páginas estáticas. Poderia me mostrar o código usado?

house disse...

Ola Ariane, primeiramente parabens pelas dicas disponibilizadas por aqui, pra leigos como eu é uma grande ajuda, eu peguei 1 template pra me trocar no meu blog no blospot, mas ele n vem com essa funçao Leia mais, gostaria de addicionar, mas seu post diz que o tutorial foi reformado em 2008, gostaria de saber se ainda esta funcionando este tutorial? Grato pela atençao e fica com Deus.

tatah disse...

ariane
como faz pra tirar o read more do meu blog e mostra a postagem inteira
meu blog é?
http://mundinpop.blogspot.com/

Administrador disse...

Primeiramente gostaria de agradecer pelas dicas, mas vamos ao x da questão já tenho algumas postagens em meu blog, como faça para este codigo valer para elas, ou seja as postagens antigas como faz para colocar o leia mais nelas??

LDCmusic Produções disse...

Boa noite, Ariane

Primeiramente parabéns pelo seu blog e desenvolvimento de seu
trabalho. Tentei realizar esse procedimento do Hack no meu blog:
www.ldcmusic.blogspot.com e não obtive sucesso. Na realidade
fiz o teste em um blog teste que fiz ( uma cópia do LDCmusic )
Você tem alguma sugestão de solução para me auxiliar ?

Agradeço antecipadamente,

Atenciosamente Carlos Junior

Casa Adettos disse...

Oi Ariane,
Muito bom seu trabalho, obrigado por compartilhar!

Implementei o hack de postagem em um blog teste e esta funcionando bem. O meu prolema eh que crie novas paginas nesse blog, para dividir por assunto, e nao consigo fazer com que essas novas paginas funcionem da mesma forma que a inicial. Tem como resolver isso? Vejo que vc utiliza esse recurso mas em um memu com imagens.

Novamente obrigado,
Antonio Carlos

Vills disse...

Eu no consigo achar a segunda parte

O Mundo Fora D'Agua disse...

Olá tudo bem? Eu gostaria de saber, qual é a taga, onde eu tenho colocar antes? Porque você escreveu "[b]Vá ao HTML do seu blog e antes da 'tag' , cole este código"[/b]. Qual é essa tag?
Obrigada !

Postar um comentário

Os comentários são moderados.