Tutorial : Leia Mais Estilo Roll

(Tonari no Kaibutsu-Kun ♥)

Yoo *~*

Bem, hoje vou postar um tuto de como personalizar o Leias Mais no estilo roll :3
Para visualizar o resultado continue lendo o post ^^




Preview/Créditos

Vamos ao tuto ;)

Vá em Modelo >> Editar HTML >> Dê CTRL + F e pesquise por:

<data:post.jumpText/>

Ao achar, substitua-o por este código:

<p align='right'><a expr:href='data:post.url'><img class='leiam' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhaPtgkLhmsh4PgXWBCPjtcbn8A6hEcC1-qGUrXJTk5d2pZ5FoJ-5riwKGkDzpu98n45pmkJm2G9w7tVBlpAZBdy1K9IHSSYlvWBmJOHvV5h5E3hea_mIuxy0Ih-WwoObv0xP9plyLrRP0/s1600/leia.png'/></a></p>

Em seguida procure por :

]]></b:skin>

Logo acima da tag pesquisada, cole o seguinte código:

.leiam{
background:url('LINK_DA_IMAGEM') top;
-webkit-transition-duration:1s; -moz-transition-duration:1s; -o-transition-duration:1s; }
.leiam:hover{
background:url('LINK_DA_IMAGEM') bottom;
-webkit-transition-duration:1s; -moz-transition-duration:1s; -o-transition-duration:1s; }

No background você precisa colocar o link da imagem, Agora é só criar a imagem que você quiser e editar. Alguns modelos feito pelo dono do blog onde achei o tutorial, para vê-los, Clique Aqui.

Devidos e merecidos créditos ao Chá & Cupcake.

___________________________________________________

Então, espero que tenham gostado, os créditos de onde encontrei o tuto está acima ^_^

Kisses ;*