Sharethis: Facebook share

Olá! Eu sou o Jayme, também conhecido como Piu e sou mais um aqui para enviar posts sobre computação. Sempre gostei do blog - exceto a parte de demonstrações matemáticas bizarras - e fiquei muito feliz em ter a chance de participar dele também. Assim que fui convidado pelo Rodrigo tive que aceitar. ;)
Bem, como trabalho com desenvolvimento de sistemas web em python/django - pra quem isso pareceu grego, eu faço sites -, além de usar jquery, um pouco de JSP, MySql, Apache, versionamento e correlatos. Então, esperem posts sobre tais assuntos.

Para começar, vou transferir para cá os posts do meu blog. Vou começar pelo post sobre o sharethis.


Estava tentando usar o Sharethis para compartilhar conteúdo no Facebook e não me dei bem com ele. Pois ele SEMPRE usa uma url reduzida - gerada por ele - para compartilhar e não permite a alteração dela. Uma vez que tal url é usada para o controle interno do sistema e suas estatísticas. Tal URL causa alguns problemas com o Facebook, como exibir a url reduzida no lugar do título e do conteúdo compartilhado. Para as demais plataformas, como o Twitter, funciona perfeitamente. O problema em si nem é o Sharethis, é o Facebook mesmo. Enfim.
Para resolver o problema, implementei diretamente o share do Facebook.

Este código, chamado de Open Graph Protocol, vai no topo das páginas a serem compartilhadas - não nas páginas onde o link vai ficar:

Por exemplo, numa listagem de notícias, cada notícia terá sua própria página para exibição isolada - onde geralmente podemos comentar a notícia e etc. É nessa página "isolada" que as tags meta deverão ser inseridas.

Tendo colocado as tags corretamente, basta inserir este código na sua página com o link para a página a compartilhar o atributo "share_url" - lembre-se: a url da página com as open tags no código do cabeçalho! - para tudo funcionar.

No meu caso, eu customizei um pouquinho o link para compartilhar com este código css:

...
span.fb_share_count_nub_right, span.fb_share_count_right { display: none; } /* oculta o contador */
span.FBConnectButton:active, span.FBConnectButton, span.FBConnectButton_Small, span.FBConnectButton_RTL_Small { background-position: left -188px; line-height: 14px; } 
...

Esse código só faz o contador de shares desaparecer e aumenta um pouquinho o botão.


A documentação que consultei do Facebook se encontra aqui.

Espero que seja útil para alguém!
Até mais!