Gadget de redes sociais com efeito na sidebar em blogs

Hoje, atenderemos o pedido do nosso leitor Michel Tito que me pediu por e-mail, como colocar e aplicar os efeitos no gadget das redes sociais (como o do blog). O tutorial é simples, pois o gadget não tem não tem muitos efeitos, mas você pode adicionar mias! Vamos ao tutorial?

1. Acesse a guia Modelo e clique no botão Editar HTML. Depois, pressione Ctrl+F para abrir o Localizador e procure pela tag abaixo.

]]></b:skin>

2. Imediatamente, cole o código a seguir acima da tag encontrada. Lembrando que você pode fazer alterações.

/* ----- Redes Socias ----- */
div.sidebar-social-gadget {
text-align:center;
}
div.sidebar-social-gadget img {
opacity:1;
-webkit-transition: all 0.6s ease;-moz-transition: all 0.6s ease;-o-transition: all 0.6s ease;transition: all 0.6s ease;
}
div.sidebar-social-gadget img:hover {
opacity: .4;
-webkit-transition: all .8s ease;-o-transition: all 0.4s ease;-moz-transition: all 0.5s ease;transition: all 0.6s ease;
}

3. Clique no botão Visualizar e se estiver tudo correto, clique em Salva modelo.

4. Agora, acesse a guia Layout e clique em Adicionar um gadget. Escolha a opção Editar HTML/JavaScript e no campo conteúdo, cole o seguinte código.

<div class="sidebar-social-gadget" oncontextmenu="return false" ondragstart="return false"><a href="URL-CANAL-YOUTUBE" target="_blank"><img src="https://lh3.googleusercontent.com/-IUPLrAYydHQ/TtqYGDAcJYI/AAAAAAAABug/-b3sJ99i9Tc/s64/youtube.png" border="0" alt="YouTube" /></a>

<a href="URL-DO-FEED-DO-BLOG" target="_blank"><img src="https://lh6.googleusercontent.com/-ywUIoWcKWww/TtqYGYF6TCI/AAAAAAAABuo/tru0CDVL3ZY/s64/rss-feed.png" border="0" alt="Feed" /></a> <a href="URL-DO-TWITTER" target="_blank"><img src="https://lh6.googleusercontent.com/-sHHZTFZDSsg/TtqYFoHNlzI/AAAAAAAABuQ/9KcPtxTTZaE/s64/twitter.png" border="0" alt="Twitter" /></a> <a href="URL-DA-PÁGINA-FACEBOOK" target="_blank"><img src="https://lh5.googleusercontent.com/-HGXOzHdmPfU/TtqYF_NzAOI/AAAAAAAABuY/tDNp0yMQKXg/s64/facebook.png" border="0" alt="Facebook"/></a></div>

Altere os partes destacadas de vermelho pelo URL indicado. Se preferir, altere as partes destacadas de azul pelo URL do ícone.

5. Clique em Salvar e depois em Salvar organização.

Pronto, agora seu gadget está instalado. O seu pedido está cumprido, querido leitor Michel Tito. Abraços e boa sorte! Utilize os botões abaixo para compartilhar o artigo.