Botão " Leia Mais " ou " Continue Lendo "
Autor: Thiago Mendes | Publicado: 2012-02-26T01:59:00-08:00

Olá pessoal, resolvi utilizar o recurso do blogger de mostrar as postagens
resumidas na página inicial com um botão para continuar lendo, é bompara quem quer aproveitar bem os espaços do seu&nbsp;blog&nbsp;e deixar maisorganizado.







Tem muitos metodos de se fazer o&nbsp;"Leia mais", mas eu recomendo o proprio recurso do blogger, pois é mais compatível e muito mais leve.Vamos começar...







Como fazer um botão de "Leia mais..."?Eu gosto de&nbsp;facilidade, nada de muito trabalho, então o programa que eu recomendo para editar imagens é o PhotoScape, se vc não tem este programa&nbsp;clique aqui para fazer o download, e instale ele em seucomputador.1º Procure alguma imagem para colocar no seu botão, depois abra ela no PhotoScape e vá se familiarizando com o programa.Como eu fiz o botão aqui do qualo:&nbsp;&nbsp;&nbsp;2º Feito o botão, salve em seu computador, e agora vamos hospedar nainternet. Para isto entre no&nbsp;http://imageshack.us/, este é um&nbsp;site&nbsp;onde podemos hospedar imagens gratuitamente, clique em&nbsp;Browse:3º Na janela que se abre selecione o imagem do seu botão e clique em"Abrir"&nbsp;e depois em&nbsp;"Carregar agora";4ºDepois de terminar de carregar, copie o endereço dentro da linha&nbsp;"Link direto", este é o endereço de sua imagem;5º Cole o endereço de sua imagem em um documento de Bloco de notas ou deixe a página do ImageShack aberta;Ativar o recurso "Leia mais" no blogger1º Acesse sua conta no blogger e vá em&nbsp;"Configurações", na aba"básico"&nbsp;na parte de baixo da página em&nbsp;"Configurações Globais", veja se esta marcada a opção "Editor atualizado", se não estiver marque e clique em&nbsp;"Salvar configurações";2º Agora clique em&nbsp;"Postagem"&nbsp;veja se já aparecem as novas ferramentas:3º Escreva uma postagem de teste, e logo abaixo do paragrafo que vc quer que apareça na página inicial, vc clique no botão indicado na imagem acima. Repare que aparece uma linha cinza, é neste ponto que aparecerá o&nbsp;"Leia mais";4º Poste e veja na&nbsp;PÁGINA INICIAL&nbsp;se apareceu a opção&nbsp;"Mais informações&gt;&gt;", se não apareceu é porque não está ativado em seu template (templates antigos), então vamos ativar:O recurso do LEIA MAIS não aparece, veja como fazer:1º Faça um&nbsp;BACKUP&nbsp;de seu modelo de template;2º Vá em&nbsp;"Design"&nbsp;e em&nbsp;"Editar HTML", marque a opção&nbsp;"Expandir modelos de widgets";3º Aperte "Ctrl + f" e procure pelo código abaixo:
&lt;data:post.body/&gt;
4º Logo abaixo cole este código:
&lt;b:if cond='data:post.hasJumpLink'&gt;

&lt;div class='jump-link'&gt;

&lt;a expr:href='data:post.url + "#more"'&gt;&lt;data:post.jumpText/&gt;&lt;/a&gt;

&lt;/div&gt;

&lt;/b:if &gt;
5º Pronto agora já irá aparecer.Como colocar imagem no lugar de "Mais informações&gt;&gt;"1º Em&nbsp;"Design"&nbsp;e&nbsp;"Editar HTML"&nbsp;com a opção&nbsp;"Expandir modelos de widgets"&nbsp;marcada, aperte "Ctrl + F" e procure pelo código:
&lt;data:post.jumpText/&gt;
e troque por:
&lt;img src='endereço da sua imagem'/&gt;
Substitua a parte vermelho pelo endereço do seu botão, aquele que hospedamos no começo do tutorial.ou se preferir colocar imagem e texto substitua por:
&lt;img src='endereço da imagem' style='vertical-align:middle;border:0'/&gt;Leia mais...
É isso ai pessoal, salve e faça isto nas postagem que vc quiser.Não esqueçam de comentar!