Menu em imagem com hover

Olá pessoal, trouxe um tutorial que me foi pedido na ask.

Sabe aqueles blogs que tem o menu em imagens? É esse que vou ensinar e

é super fácil colocar no blog.

Vá em Design, e em elementos da página adicione um gadget de HTML/JavaScript e cole o seguinte código fazendo as devidas alterações:

<center><a href="link do seu blog"><img src="URL da imagem normal" onmouseout="this.src='Repita a URL da imagem normal';" onmouseover="this.src='URL da imagem
no estado hover';" /></a></center>

Ficando assim:

<center><a href="link do seu blog"><img src="URL da imagem normal" onmouseout="this.src='Repita a URL da imagem normal';" onmouseover="this.src='URL da imagem
no estado hover';" /></a><a href="link do seu blog"><img src="URL da imagem normal" onmouseout="this.src='Repita a URL da imagem normal';" onmouseover="this.src='URL da imagem
no estado hover';" /></a><center><a href="link do seu blog"><img src="URL da imagem normal" onmouseout="this.src='Repita a URL da imagem normal';" onmouseover="this.src='URL da imagem
no estado hover';" /></a></center>

Repita quantas vezes quiser.

-Onde pede "link do seu blog" troque pelo link da página que você desejar.

-No lugar de "URL da imagem normal" é a url da imagem sem passar o mouse e onde pede "repita a URL da imagem normal" é a mesma coisa.

-Já em "URL da imagem no estado hover" coloque a imagem que você quer que apareça ao passar o mouse.

-Se você não quiser o menu centralizado é só retirar as tags do começo e do fim, <center> e </center>