Efeito hover nos links "Postagens mais recentes" "início" "Postagens mais antigas"

 

Hooy pessoas meu tempo está super corrido então não prometo posts diários ok  e quem me mandou mensagens no meu e-mail (entrevistas, dúvidas e outros) só irei responder no sábado. A escola tá uma loucura (quem mandou reprovar o ano né Jackie) 

Ah e sobre o tutorial de hoje não passa de um truque de imagens assim como o ''efeito hover no hack leia mais'' 

Atenção: Antes de qualquer modificação salve seu template ou faça em um blog de testes, ok! 

Outra coisa muito importante. Quem já modificou essa parte do template assim como eu obviamente não irá encontrar nenhum dos códigos abaixo. Então na hora de procurar procure pela url da imagem que você está usando e apague o trecho que a acompanha exemplo: <img src="URL DA SUA IMAGEM" />  e no lugar cole o código sugerido no decorrer do tutorial! 

Alterando ''postagens recentes''

vá no seu HTML marque a opção ''expandir modelos de widgets'' dê um CTRL + F e procure por:   <data:newerPageTitle/>   

apague somente esse trecho destacado e no lugar cole:

<img border='0' onmouseout='this.src=&apos;url da imagem principal&apos;' onmouseover='this.src=&apos;url da imagem com o mouse em cima&apos;; return true' src='url da imagem principal'/>

Alterando ''início''

agora procure por:   <data:homeMsg/>

apague e no lugar cole:

<img border='0' onmouseout='this.src=&apos;url da imagem principal&apos;' onmouseover='this.src=&apos;url da imagem com o mouse em cima&apos;; return true' src='url da imagem principal'/>

Alterando ''postagens antigas''

agora procure por:  <data:olderPageTitle/> 

apague e no lugar cole:

<img border='0' onmouseout='this.src=&apos;url da imagem principal&apos;' onmouseover='this.src=&apos;url da imagem com o mouse em cima&apos;; return true' src='url da imagem principal'/>

O próprio código já diz o que deve ser feito, mas é sempre bom deixam bem explicado:

Nos trechos url da imagem principal apague e cole a url da imagem que irá aparecer sem o mouse estar em cima, exemplo:

No trecho url da imagem com o mouse em cima apague e cole a url da imagem que irá aparecer com o mouse em cima, exemplo:

Coloque a url das imagens em seus devidos lugares, visualize se estiver tudo certo salve (:

Imagens exemplo:

Imagens normal    imagem em hover

   

    

P.S amanhã eu respondo os comentários *--*