Como colocar o hack “Leia Mais” no Blogger

Neste post vou ensiná-los a usar três modelos de códigos para resumo de postagens na página inicial do Blogger: o primeiro faz um resumo automático em todas as postagens, o segundo faz um corte manual e o terceiro é o próprio “Leia Mais” (jump break) do Blogger.

A nomenclatura para o resumo de postagens na página inicial varia muito. Podemos chamar de “leia mais”, “continue lendo”, “read more” e etc.

Os três modelos são simples de implementar e a escolha fica a critério do cliente ;)

Lembrando que nos templates que disponibilizo aqui no DB, o segundo hack já vem instalado.

Antes de fazer qualquer alteração, é altamente recomendável fazer um backup do template.

Modelo 1-Hack “Leia mais” com corte automático

Entre na aba  layout, clique em editar html e marque a caixa expandir modelos de widgets, localize (Ctrl + F) a tag e cole, antes dela, o seguinte código:

O destaque representa a quantidade de caracteres html que será exibida na página inicial.
Procure agora por este código:

Pra quem usa templates do Dicas Blogger, procure por:

Continue lendo >>

Substitua tudo por:

Continue lendo...

Clique em visualizar e se tudo estiver ok, salve.

Se quiser substituir a frase “continue lendo” por outra de sua preferência, basta substituí-la no código acima (destaque em vermelho).

ATUALIZAÇÃO EM 26/03/2010: Este hack parou de funcionar, por causa de um script que estava hospedado em um servidor que deixou de ser gratuito. Para que o hack volte a funcionar corretamente, leia este post do Compulsivo até o final :

Posts resumidos no Blogspot sem gambiarras

Modelo 2-Hack “Leia mais”com corte manual

Entre no html do seu template, marque a caixa expandir modelos de widgets e procure por . Cole o código abaixo antes da tag

Procure agora por:

ou por:

     

     

   

Substitua tudo por:

Continue lendo >>

Clique em visualizar e se tudo estiver ok, clique em salvar.

Escreva seu post normalmente e quando terminá-lo, clique em editar html e coloque o  código onde você deseja iniciar o resumo e no final do post.

Post (área de corte) restante do post

Veja um exemplo na imagem abaixo:

Pra quem usa o Windows Live Writer, é necessário clicar na aba código fonte e colocar o após o término de um parágrafo “

” e o também.

Modelo 3-Jump Break – o “leia Mais” do Blogger

Esta nova função já está presente nos modelos padrão do Blogger.

Para quem usa um template personalizado – que é o caso dos modelos criados por mim e pelos demais colegas – é preciso instalar um código no html do template.

Entre em layout, editar html e clique em expandir modelos de widgets. Usando a combinação Crtl+F do seu teclado, procure pelo seguinte trecho:

Logo abaixo do trecho citado, cole o seguinte código:

No caso dos templates do Dicas Blogger, procure por
. Este trecho aparecerá 2 vezes. Cole o código embaixo do segundo trecho:

Para resumir os posts, é preciso usar o novo editor de textos do Blogger. Para habilitá-lo, entre no painel, clique em configurações e, no final da página, procure por configurações globais. Marque a opção editor atualizado.

Escreva seu post, escolha a área de corte (resumo) e clique no ícone do jump break

Muitos usuários relataram que após o uso do jump break a sidebar foi parar embaixo dos posts, mas é preciso apenas tomar alguns cuidados. O corte tem que ser inserido após o fechamento de uma div. Portanto, após a inserção do jump break, é preciso clicar em editar html  e inserir o “more” após o fechamento de uma div (

)

No Jump Break, aparece a frase “mais informações” ao final do post. Para mudar a frase, entre em elementos de página e procure por postagens no blog (1). Clique em editar (2) e depois altere para um texto do seu gosto (3).

Todos os modelos já haviam sido publicados aqui e em outros blogs, mas achei que ficaria mais legal colocá-los em um único post para facilitar a vida de todos.

Créditos para Usuário Compulsivo, Blogger Buster e El Escaparate de Rosa.