Cartão de Visitas Expansível no Canto do Blogger

Nesta postagem venho compartilhar aqui com vocês este código bem legal para quem deseja deixar uma mensagem de boas vindas. E, o melhor, este código não pesa no carregamento do blogger.

Para coloca-lo no blogger... Entre em "Modelo" - "Editar HTML", dê um Ctrl + F e procure pela tag

]]></b:skin>

Tendo encontrado a tag, ACIMA dela, cole o seguinte código

#menu
{z-index:999;
background-color:#fff;
border:2px dashed #FF0000;
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-left:-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:270px;
height:175px;
-moz-border-radius:0px;
border-radius:15px;
padding:10px;}
#menu:hover #icon
{margin-top:10px;
margin-left:0px;
margin-bottom:4px;}

Pode Salvar.

Agora, entre em "Layout" - "Adicionar um Gadget" - "HTML/JavaScript e cole o código

<div id="menu"><center>
<div id="icon"><img src="URL DE UMA IMAGEM">Oi</div>

Obrigado pela visita, seja bem vindo (a) é muito bom estar na sua companhia, volte sempre!!!

</center><p></p>

<div align="right"> <u>Seu nome</u> 

</div></div>

Tendo feito isto, basta salvar e pronto!!!