Menu em imagem com estado hover

Hello cherries!!!!Como vocês estão???? Eu vou bem, muito obrigada!!! Hoje irei mostrar como ter um menu super legal no estado hover, que nada mais é que a mudança da imagem (texto ou link em outros casos) ao passar o mouse,  o código pode ser usado para outras coisas também, não apenas para fazer um menu!!!

Ex:

Vá em Design e em elementos da página adicione um gadget de HTML/JavaScript e cole o seguinte código:

<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>

Em link do seu blog você irá colocar o link do seu blog.
Em URL da imagem normal,coloque o url da imagem que você queira que fique sem passar o mouse, e em Repita a URL da imagem normal,a mesma coisa!
Em URL da imagem no estado hover, coloque o url da imagem que você queira que apareça quando passar o mouse!
Case você não queira no centro é só retirar o <center> no início e o </center> no final.

É isso aí, beijinhos!!!!