Esse é o famoso link “Leia mais…” que aparece nas primeiras páginas de alguns blogs e sites, onde se pode ler ou um resumo do artigo ou seu primeiro parágrafo e, caso o leitor queria saber mais e continuar lendo, basta clicar ali para abrir o restante do texto. Isso é extremamente importante para se ganhar espaço no blog, conforme usamos aqui também.
ERRATA: O Blogger já disponibiliza esse serviço de forma padrão. Veja o novo tutorial, bem mais simples:
Já tratamos aqui sobre esse assunto, mas resolvi reescrever o artigo. O antigo vai continuar publicado – Postagens expansíveis ou link “Leia mais” – para servir de referência. Foi um dos primeiros textos publicados aqui e sei que não ficou muito bom (eu mesmo estava aprendendo). Com um pouco mais de experiência, reescrevi o texto para ajudar melhor quem quer colocar essa facilidade em seu blog.
Um blog tem que ser de fácil leitura e isso significa que o seu visitante não quer perder tempo passando páginas longas sem encontrar o que quer. As pessoas cada vez lêem menos e cada segundo na internet é precioso. Páginas com artigos longos ou muitos deles inteiros, demoram para abrir e fazem sua página lenta. Com isso, seu visitante pode não ter paciência em esperar e não ficará tempo algum.
Veja como é fácil instalar Resumo de Postagens:
1. Abra o painel do Blogger e clique em “Layout” e “Editar HTML”. Procure pela caixa de verificação “Expandir modelos de widgets” e marque a caixa. Sem isso não será possível encontrar as linhas do código e os locais para inserir as funções.
2. Nas primeiras linhas do seu código, encontre “<head>” e logo abaixo copie e cole o seguinte trecho:
<style>
<b:if cond=’data:blog.pageType == "item"’>
span.fullpost {display:inline;}
<b:else/>
span.fullpost {display:none;}
</b:if>
</style>
3. Agora encontre a seguinte linha: “<data:post.body/>” e abaixo disso copie e cole o seguinte:
<b:if cond=’data:blog.pageType != “item”‘><br />
<a expr:href=’data:post.url’>Leia mais!</a>
</b:if>
O texto destacado em vermelho pode ser substituído como quiser, até mesmo por uma imagem ou com imagem e texto, como é aqui no [ Ferramentas Blog ].
4. Clique no botão alaranjado “SALVAR MODELO”.
Esta parte está terminada, mas agora falta ir em cada um dos seus artigos já publicados e determinar qual será a parte do resumo que aparecerá antes do link “Leia mais!”. Esse trabalho é nanual e terá que ser feito em todos os textos, nos já publicados e nos que você ainda for escrever.
Sempre que escrever um artigo, será preciso inserir os seguintes códigos:
Texto resumo da postagem.
<span class=”fullpost”>
Restante do texto que só aparece depois de clicar em “Leia mais!”.
</span>
Isso deve ser inserido após você digitar todo o artigo e já souber o que quer colocar escrito antes do link. Aqui no [ Ferramentas Blo ] usamos sempre o primeiro parágrafo dos textos como “resumo”. Para adicionar o código, na aba do editor do texto (“Criar”) escolha “Editar HTML”. Assim você verá o seu artigo em formato HTML; é aí que você colocará as linhas do código indicadas acima.
Faça testes com um artigo antes de aplicar o código em todos; de preferência crie um novo artigo só para fazer testes. Lembre-se de sempre fazer um Backup do seu modelo antes de fazer qualquer modificação no código-fonte.
Veja a ajuda original do Blogger sobre esse assunto clicando aqui!
Gostei do post! Dá um pouco de trabalho para achar o código do HTML, mas vale e pena.
Ferramentas sempre me ajudando! ;D
olá marcos,
quando for colar no editor pde ficar do mesmo jeito que colou ou tem que alinhar,se tem que alinhar,como fazer?
obrigado!!
@Lpracing,
Não precisa alinhar nada.
Obrigado pela dica !!. Que Deus te abençoe. achei melhorou muito o Blog os textos não tomam mais a página inteira. Valeu !!!!
Excelente post. Este recurso é indispensável para qualquer blog, principalmente aqueles com matérias detalhadas. Sanou minha necessidade. Muito obrigado.
Uma ajudinha para os que estão tendo dificuldades de achar o código na selva de tags que é o template do blog: Antes de dar CTRL+F (find) para procurar o texto, marque uma pequena porção (qualquer coisa) dentro da caixa com o código. O FIND será corretamente direcionado para dentro da caixa de texto, e não fora dela, como acontece em alguns navegadores. Basta digitar o texto que estiver procurando e ser feliz. Paz para todos.
Sensacional!
Não encontrei a solução deste problema em lugar algum, então resolvi vasculhar o seu blog. Sem dúvidas, na matéria antiga, você não tinha muita experiência, mas agora, pode se considerar como um profissional!
Parabéns!
Maravilhoso!!!
Na ajuda do Blogger tem as dicas, mas em nenhum momento falam que tem que expandir os modelos de widgets!!!
Eita nois…. VALEU!!
Excelente explicação. apesar de não utlizar o formoso (Post "Continuar Lendo")
fiz um teste pra ver se realmente funcionaria e o mesmo pegou legal
diferente de muitos outros… esse aqui nota 10.
estou com uma dúvida… por em vou tulizar seu Formulário… XD
Olá por ora estou apenas lendo vendo se aprendo um pouquinho. Quero ter mais visitar no blog, mas ainda não me dediquei a aplicar as tuas dicas.
Parabéns pela iniciativa. Sempre estou aqui lendo alguma coisa.
Pingback: Dicas para Blog – Artigos de Fevereiro/2009 | [ Ferramentas Blog ]
Pingback: Tutoriais e Dicas – criar Blog [ Intermediários ] | [ Ferramentas Blog ]