Contador de fãs no Facebook em forma de texto para blogs e sites

• Facebook
• WhatsApp
• Twitter
• Pinterest
• LinkedIn

Fazer uma página de fãs para seu blog no Facebook é comum nos dias de hoje, principalmente pra quem busca realmente formas de divulgação gratuitas.
O legal das páginas de fãs é que podemos ver quem gosta e aprova nosso blog e depois comparar com outros websites. E é por isso que usando um código que o próprio Facebook desenvolveu, criei um mecanismo que mostra o número de pessoas que aprovam e recomendam seu trabalho, podendo ser usado em qualquer plataforma (Blogger, WordPress, etc) ou sites.

O contador funciona mais ou menos como o contador de assinantes Feed e seguidores do Twitter que desenvolvi alguns meses atrás. Ele pega o valor da quantidade fãs e joga na tela em forma de texto, podendo modificar sua aparência da forma que você quiser… É só abusar da criatividade.

Exemplo:

Aprenda como fazer:
1 – Antes de tudo crie seu perfil no Facebook, depois uma página de fãs. (Siga o tutorial: Como criar uma página de fãs no Facebook por Dicas Blogger)

2 – Copie o código abaixo e cole onde você quiser usar o contador dentro do seu blog/site:

<script type="text/javascript" src="http://codigosblog.net/servidor/contadorfacebook/facebook.php?id=ID_DO_PERFIL"></script>

3 – Acesse sua página de fãs no Facebook e clique sobre a imagem do perfil (caso a ID ainda não esteja aparecendo na barra de endereços), dessa forma será mostrado a id da página na barra de endereços. Veja o exemplo:

Link: http://www.facebook.com/pages/Codigos-Blog/157140557643201
Encontrando a ID:

ID: 157140557643201

4 – Copie a ID da sua página e coloque no lugar de ID_DO_PERFIL no código fornecido acima.
Exemplo Códigos Blog:

• Antes: <script type="text/javascript" src="http://codigosblog.net/servidor/contadorfacebook/facebook.php?id=ID_DO_PERFIL"></script>
• Depois: <script type="text/javascript" src="http://codigosblog.net/servidor/contadorfacebook/facebook.php?id=157140557643201"></script>

5 – Salve e Pronto!
O código vai mostrar apenas o número. Então agora escreva o que quiser depois, coloque imagens, jogue alguma cor, etc.

Alguns widgets prontos:

1)

Código:

<a style="text-decoration:none; padding: 0 0 0 20px; background: url(http://codigosblog.net/servidor/contadorfacebook/facebook_mini.png) no-repeat left center;" href="LINK_PERFIL_FACEBOOK" target="_blank" title="Faça parte você também!"><script type="text/javascript" src="http://codigosblog.net/servidor/contadorfacebook/facebook.php?id=ID_DO_PERFIL"></script> Fãs no Facebook</a>

2)

Código:

<div style="padding: 0; margin: 0;">
<img src="http://codigosblog.net/servidor/contadorfacebook/facebook_medio.png" style="padding: 0 7px 0 0; float: left; border: 0;"/>
<a style="text-decoration:none;" href="LINK_PERFIL_FACEBOOK" target="_blank" title="Faça parte você também!"><script type="text/javascript" src="http://codigosblog.net/servidor/contadorfacebook/facebook.php?id=ID_DO_PERFIL"></script> 
Fãs no Facebook</a><br/><a style="text-decoration:none; font-size:small;" href="LINK_PERFIL_FACEBOOK" target="_blank" title="Faça parte você também!">participe você também</a>
</div>

3)

Código:

<div style="padding: 0; margin: 0; text-align: center;">
<img src="http://codigosblog.net/servidor/contadorfacebook/facebook_big.png" style="padding: 0 0 3px 0; border: 0;"/><br/>
<a style="text-decoration:none;" href="LINK_PERFIL_FACEBOOK" target="_blank" title="Faça parte você também!"><script type="text/javascript" src="http://codigosblog.net/servidor/contadorfacebook/facebook.php?id=ID_DO_PERFIL"></script> Fãs</a>
</div>

• Substitua LINK_PERFIL_FACEBOOK pelo link da sua página de fãs no Facebook

Seja fã da nossa página no Facebook! (Página nova! Não repare na organização por enquanto! =P)

Aproveite!
Abraços

• Facebook
• WhatsApp
• Twitter
• Pinterest
• LinkedIn