MASIGNCLEAN101

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 esse artigo!
Marcus Vinicius
escreve para o Mundo Informal sob a licença Creative Commons BY-SA 3.0. Você pode usar e compartilhar este conteúdo desde que credite o autor e veículo original do mesmo.
avatar

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

18 de junho de 2014 19:21
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!