WIDGET DE REDES SOCIAIS PARA BLOG / WIDGET OF NETWORKS FOR BLOG

Want to see it in English? Click the translator beside → → →

Olá pessoal, hoje estarei ensinando a vocês como adicionar um widget de redes sociais  em seu blog, sei que existem muito widgets de redes sociais espalhados pela web

Acesse  o painel do Blogger, escolha a opção Layout, adicionar Gadget do tipo HTML/JAVASCRIPT e adicione o código abaixo, não esqueça das alterações.

<style> 
.social-box { margin-bottom: 10px; overflow: hidden; } 
.social-box img { float: left; } 
.social-box-text { 
position:relative; 
float:right; 
padding:4px 10px 6px 10px; 
width:212px; 
background:#FFF
border:1px solid #d2d2d2
-webkit-box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.1);
box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.1);
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
}
.social-box-descrip { font-family:'PT Sans'; font-size:16px; color:#777; display:block; margin-bottom:1px; }
.social-box-count { color:#999; font-size:11px; }
</style>
<div class="social-box">
<a href="URL DA FANPAGE DO FACEBOOK" target="_blank"><img border="0" height="48" src="https://lh5.googleusercontent.com/-UP21K6OMlYE/T-z8pM_E5rI/AAAAAAAABww/8_rajMipoT8/s48/facebook.png" width="48"></a>
<div class="social-box-text">
<span class="social-arrow">
<span class="social-box-descrip"><a href="URL DA FANPAGE DO FACEBOOK" target="_blank">Siga-nos via Facebook</a></span>
<span class="social-box-count">Curta nossa página no Facebook</span> </span></div>
</div>

<div class="social-box">
<a href="https://twitter.com/USUÁRIO DO TWITTER" target="_blank"><img border="0" height="48" src="https://lh6.googleusercontent.com/-I72XDQVFiEE/T-z8x8yOWoI/AAAAAAAABys/YeekshujxHM/s48/twitter.png" width="48"></a>
<div class="social-box-text">
<span class="social-arrow">
<span class="social-box-descrip"><a href="USUÁRIO DO TWITTER" target="_blank">Siga-nos no Twitter</a></span>
<span class="social-box-count">Siga-nos nosso perfil no Twitter</span>
</span></div> </div> <div class="social-box">
<a href="URL DO FEED" target="_blank" expr:href="http://www.mulheresfantasticas.com.br/feed"><img border="0" height="48" src="https://lh5.googleusercontent.com/-L0UPERxBb8k/T-z8sLH8dRI/AAAAAAAABxk/jgWMVHY7kTo/s48/rss.png" width="48"></a>
<div class="social-box-text">
<span class="social-arrow">
<span class="social-box-descrip"><a href="URL DO FEED" target="_blank">Assine o RSS Feed</a></span>
<span class="social-box-count">Assine e acompanhe-nos via Feed</span> </span></div>
</div>


OBS: Não deixe de alterar as partes destacadas em vermelho pelo que está sendo pedido.

0 comentários:

Postar um comentário

:a   :b   :c   :d   :e   :f   :g   :h   :i   :j   :k   :l   :m   :n   :o   :p   :q   :r   :s   :t :u :v :x