29 de dezembro de 2011

Como adicionar o botão ‘Curtir’ do Facebook ao seu site

Por sidnei

Hoje em dia a integração com redes sociais é importante para qualquer site, não apenas por ser uma boa fonte de tráfego mas também por criar uma forma de interatividade com os leitores. E uma maneira interessante de fazer isso é através do botão “Curtir” do Facebook. Com configuração simples e rápida, o botão possibilita que qualquer usuário que tenha uma conta no Facebook recomende sua página para outras pessoas.

 

 

O que é o botão “Curtir”?

O botão “Curtir” (“Like” na versão em inglês) é esse com o sinal de positivo, que substituiu o antigo botão “Tornar-se fã” (“Become a fan”), muito usado dentro do Facebook e que há algum tempo pode também ser usado dentro de outros sites e páginas.
Sites reconhecidos como modelos de boa utilização de Social Media como ferramenta de relacionamento com seus leitores fazem uso dessa ferramenta. Um bom exemplo é o Mashable.

Qual a vantagem em usá-lo?

Quando o usuário “curte” a sua página clicando sobre o botão é como se ele “dissesse” que acha aquele conteúdo interessante o bastante para indicá-lo à outras pessoas. Assim, sua página pode aparecer como sugestão para os amigos desse usuário, dentro do Facebook.
Além da questão prática, de trazer novos visitantes, adicionar possibilidades de interação estimula o relacionamento dos usuários com o seu site.

Como usar

Existem várias formas de inserir o botão na sua página. A mais simples delas, que tem o menor potencial de causar lentidão no carregamento da página ou conflito com outros scripts, é através de um pequeno iframe. Basta incluir o seguinte código no seu html:

2.show_faces=false&width=380&action=like&colorscheme=light&height=25&locale=pt_BR" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:250px; height:25px;" allowTransparency="true"></iframe>

As duas principais alterações que você precisa fazer são: colocar a URL da sua página logo após a variável “href” (substituindo o “sua url”) e ajustar a largura do iframe para que ele se encaixe no seu layout, alterando a propriedade “width”. Pronto, basta incluir este trecho de código à sua página e você terá um resultado semelhante ao que aparece abaixo:

Botão Recomendar

Em algumas páginas, ao invés do botão “Curtir” encontramos o botão “Recomendar”. Na verdade é exatamente o mesmo botão, com as mesmas funcionalidades, configurações e comportamento. A única diferença é o verbo: recomendar. Então você pode usar o mesmo código do botão curtir trocando apenas um parâmetro: action=recommend:

2.show_faces=false&width=380&action=recommend&colorscheme=light&height=25&locale=pt_BR" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:250px; height:25px;" allowTransparency="true"></iframe>