Tutorial Leia Mais Com Imagem

Mais um tutorial para Blog esse de como colocar esse botão de leia mais no Blog, muito utilizado por Webmasters para economizar espaço vamos lá:

1 - Abra seu Blog vá em Design; Editar Html e marque a caixinha  Expandir modelos de widgets.

2 - Aperte CTRL+F em seu teclado e procure pela tag  <data:post.body/> e cole o seguinte código abaixo depois dessa tag <data:post.body/>:

<b:if cond='data:post.hasJumpLink'>

<div class='jump-link'>

<a expr:href='data:post.url + "#more"'><img src='url da sua imagem' style='width: 443px; height: 60px;'/></a>

</div>

</b:if > 

3 - cole a url da sua imagem entre scr='     e   ' style, e altere os valores de acordo com o  tamanho da sua imagem  

width: largura; 

height: altura. para centralizar a imagem basta adicionar a tag <center> e ao final </center>

<b:if cond='data:post.hasJumpLink'>

<div class='jump-link'>

<a expr:href='data:post.url + "#more"'><center>

<img src='url da sua imagem' style='width: 443px; height: 60px;'/></center>

</a>

</div>

</b:if > 

 Pronto  Salve o Template.

OBS: Mas lembre-se de editar sua postagem e fazer o corte no local desejado. para isso basta escolher o local do corte e apertar o botão " inserir Jump-break " e pronto.

Tutorial Feito por:guilherme xavier

Siga o site e você vai estar nos ajudando...

Gostou? Comente e Vire Um Seguidor!!