Menu de mensagem no rodapé

Olá xuxuzinhos! Como vão vocês??

Eu vou bem ! Acabei de acordar agora :3 Refrescou um pouco no rio, e ficou bem mais agradável dormir até tarde!( não que 11:00 seja tarde..mas minha mãe fala que é :/ ). Então galerinha, ultimamente eu só tenho postado tutoriais e nada de utilitários, acho que no próximo eu posto um utilitário.

Como eu já postei até que uma quantidade boa de tutoriais e estou começando a ficar sem ideia pra postagem. Eu gosto de postar coisas que não são muito comuns em blog! Porque fica meio chato eu postar um tuto muito comum, enquanto mil blogs já possuem ele! Eu estou pensando em fazer um tuto de dicas ( igual aquele que ensinei a fazer efeitos - você pode ver ele aqui!). Eu adoraria receber sugestões de vocês, porque eu estou precisando muito amores ! ♥

Vamos falar do Tuto, se não ficarei enchendo o saco de vocês... Esse menu é bem interessante. Ele fica fixo no rodapé e quando passa o mouse ele abre.  Entenda melhor na imagem baixo:

Se quiser aprender, continue lendo ♥

Vá em seu Layout e adicione um gadget de HTML/ Java Script  e cole o código abaixo: 

<style>

#menu
{z-index:999;
background-color:#fff;
border:2px dashed #FFC0CB;
width:50px;
height:50px;
border-radius:50px 0px 0px 0px;
-moz-border-radius:50px 0px 0px 0px;
position:fixed;
overflow:hidden;
bottom:0px;
right:0px;
-webkit-transition: opacity 0.8s linear;-webkit-transition: all 0.8s ease-in-out;-moz-transition: all 0.8s ease-in-out;-o-transition: all 0.8s ease-in-out;}
#icon
{margin-top:20px;
margin-bottom:20px;
margin-right:-12px;
-webkit-transition: opacity 0.8s linear;-webkit-transition: all 0.8s ease-in-out;-moz-transition: all 0.8s ease-in-out;-o-transition: all 0.8s ease-in-out;}
#menu:hover
{width:220px;
height:175px;
-moz-border-radius:0px;
border-radius:15px;
padding:10px;}
#menu:hover #icon
{margin-top:10px;
margin-right:0px;
margin-bottom:4px;}
</style>

<div id='menu'><center>
<div id='icon'><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8iACcXKLgyl9TNm3Wl2omW75jwOQfsVeMfBSD374QO99wB8KbNE34p9Kh7cZOefv073xod5tjAh-7W2kZ3PV1S76YcnzUCf1fBuMFoCVPVNzkrL5to3L71lh_ERVyWjF7BS0w_9wI-esw/s1600/icon1+(14).gif"/>Oi</div>
ESCREVA SEU TEXTO!
</center><p></p>
<div align="right"> <u>ASSINATURA</u>
</div></div>

 Quando for selecionar, selecione também o <style> ele ficou meio pra fora, mas faz parte do código!. Esse danadinho!

Depois é só ir alterando a cor da borda, cor de fundo e modificar o texto!
Créditos : (xx)
Por hoje é só! Espero que tenham gostado ! Bjos do fundo do  meu coração ♥