12 de mar de 2014

Widget Redes Sociais Flutuante de compartilhamento horizontal para Blogger

Sites de redes sociais se tornaram o centro das atividades da internet , porque são capazes de atrair todos os usuários que usam a internet, seja a partir de escolas, escritórios ou residências . Hoje em dia, as pessoas gostam de compartilhar conteúdos que consideram realmente interessantes em sua rede social que beneficia a todos. É vital para todo blogueiro e webmaster integrar alguma forma de compartilhamento social ou Botão Curtir em seu Blog , para que seus visitantes possam compartilhar suas postagens no melhor site de rede social, o que não só lhes dará cobertura, mas que também irá construir leitores leais. 

Há um número ilimitado de widgets de compartilhamento social, que estão disponíveis em vários blogs. Se você já viu aqueles Blogs da plataforma WordPress que têm um widget de compartilhamento social horizontal, ou seja uma "social Bar" a maioria destes blogs, contam com um plugin que faz com que os botões flutuem quando a página é rolada, por isso hoje vou compartilhar um tipo de Widget semelhante, só que voltado para nós, usuário do Blogger, que conta com botões de compartilhamento Facebook , Twitter, Google Plus , Pinterest , Digg e StumbleUpon.

Veja como funciona:


Principais funcionalidades desse widget


  • A característica mais impressionante deste widget é que ele rola junto com sua tela como uma pequena barra.
  • Ele começa a rolar de onde é inserido seu código em seu blog e flutua até a seção de comentários. 
  • Tem botões Facebook Like, Twitter Share, Google+ 1, Pin-lo e Digg. 
  • Ele é construído com ultra-rápido Jquery e CSS para que você não note qualquer tipo de problemas de velocidade. 
  • Você pode usar esse plugin em 99 por cento de Templates Blogger sem enfrentar nenhuma dificuldade.


Como instalar o widget no Blogger


Os passos para a instalação são bastante simples, por isso, basta seguir as instruções conforme mencionado abaixo.

1° passo: Acesse o painel do Blogger. Escolha o blog que será implementado. Acesse a opção Design.

2° passo: Realize o backup do seu template atual, contando que caso ocorra qualquer problema, basta realizar o upload do backup.

3° passo: Selecione a opção Editar HTML.

4° passo: Pesquise por </head> e logo ACIMA dela cole o seguinte código:



5° passo: Agora vamos adicionar o código que realmente insere os botões, e para isso localize <data:post.body/> e ANTES/ACIMA dele cole o código abaixo:



Pronto! Salve as alterações e seu widget já deverá estar funcionando! Clique em alguma postagem e teste sua funcionalidade! 

Até o próximo tutorial, e não se esqueça de deixar sua dúvida ou sugestão nos comentários! :)
Compartilhe essa postagem!
  • Share to Facebook
  • Share to Twitter
  • Share to Google+
  • Share to Stumble Upon
  • Share to Blogger
  • Share to Email
  • Share to Yahoo Messenger
  • More...

Recomendamos para você »

1 comentários

  1. Gostei. no entanto, eu tenho tido dificuldades em inserir o codigo HTML, sempre que o faco da erro. como faco

    ResponderExcluir

Seja livre para expor seu pensamento!

Se preferir, antes, leia nossas regras para comentários...
(Atenção: Comentários "Anônimo" não serão publicados. Escolha "Nome/URL". Obrigado!)
Bom comentário!

:) :-) :)) =)) :( :-( :(( :d :-d @-) :p :o :>) (o) [-( :-? (p) :-s (m) 8-) :-t :-b b-( :-# =p~ :-$ (b) (f) x-) (k) (h) (c) cheer

 
Pré-Designed by BlogThietKe Designed by @Mundo_Informal
© 2012-2014 .::Mundo Informal::. Todos os direitos Reservados
Licença Creative Commons
...See you!
Voltar ao topo