20 de fev. de 2012

Como usar o recurso Jump Break do Blogger

Com o 10º aniversário do Blogger, foram adicionados novos recursos para o serviço, incluindo um chamado “Jump Break”.

O “Jump Break” serve para encurtar uma postagem, na página inicial de um blog, e colocar um link do tipo “Continue lendo...”. Este recurso tem uma vantagem sobre o método antigo de encurtar as postagens: ele não só esconde o restante das postagens, como também não recarrega a página. O método antigo escondia, mas ainda carregava as postagens por inteiro, sendo isso um problema para postagens muito grandes e/ou com muitas imagens.

Mas essa função só está disponível para quem usa o novo editor de textos do Blogger.
Para habilitá-lo, entre no Painel > Configurações e, no final da página, procure por Configurações Globais, marque a opção "editor atualizado". Veja o exemplo:


Feitas essas modificações, vamos ao tutorial.

1. Utilizando o resumo de postagens
Quem usa templates com poucas edições ou os demais modelos disponibilizados pelo Blogger, deve entrar no novo editor de textos, escrever o post e escolher onde o resumo deve ser iniciado. Daí é só clicar no ícone "Inserir Jump Break".

1.1. Se você utiliza modelos de postagem na opção "Escrever", seu post ficará assim:


1.2. Caso você utilize modelos de postagem na opção "HTML", ficará assim:


Agora é só postar e ver o resultado. Por padrão aparecerá um link com a mensagem “Continue lendo...”.

1.3. Para alterar, entre no layout do blog e em Postagens do blog, clique em editar (imagem 1), então procure pelo texto do link (imagem 2) da página de postagem e escreva uma frase de sua preferência.

(Imagem 1)______________________________(Imagem 2)

Caso você tenha feito todo o procedimento acima e, mesmo assim, não funcionou, é porque o template que você utiliza não possui essa função habilitada, então siga os procedimentos a seguir para ativar esse recurso no seu blog.
2. Habilitando o recurso em templates personalizados
Para quem usa um template personalizado – que é o meu caso – é preciso instalar um código no HTML do template.
Veja a seguir como instalar:

2.1. Acesse o Painel do Blog > Modelo (Design, pra quem usa a interface antiga do blogger) > Editar HTML e clique em "Expandir modelos de widgets";
ATENÇÃO: Faça o backup do seu modelo atual, para o caso de ter algum problema.

2.2. Feito o procedimento no item 2.1., dentro do HTML procure pelo seguinte trecho (Use Ctrl+F):
<data:post.body/>
É possivel que você encontre mais de um trecho igual, então vá até o ultimo que você encontrou.

2.3. Logo abaixo do trecho citado, cole o seguinte código:
<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + "#more"'><data:post.jumpText/></a>
</div>
</b:if >

2.4. Visualize, se estiver tudo bem, salve!

3. Considerações finais
Se você fez todos os passos anteriores e mesmo assim não conseguiu habilitar essa função, entre em contato pelo nosso formulário ou, se preferir, me mande um email e tentarei corrigir o erro pra você, segue o email abaixo:
gerenciandoideias@live.com

OBS.: Essa função é utilizada para ocultar apenas posts que você tenha interesse, caso queira que todos os posts fiquem resumidos na pagina inicial do blog, inclusive os antigos, leia esse artigo e veja uma maneira fácil.

ATENÇÃO: Diversos leitores reportaram que a nova função “Leia mais” faz com que o layout do blog fique deformado, jogando as colunas para debaixo dos posts. Então encontrei uma solução no Dicas Blogger, veja aqui a solução.

Até a próxima!

a Comentários