Widget contador de assinantes feed e seguidores do Twitter

Atualizado! 05/02/2010 Atualizado! 25/03/2010



Alguns dias atrás publiquei aqui no Códigos Blog um script que mostra em forma de texto o número de assinantes feed de qualquer blog e fiquei devendo o contador de seguidores do Twitter. Pois é, não consegui desenvolver um contador de seguidores como prometi, no entanto o Marcos Lemos do Ferramentas Blog conseguiu arrumar o tal script.

O Marcos está com alguns problemas no servidor do widget e com minhas artimanhas e algumas dicas do Fernando, consegui criar o código para ler o número de seguidores do Twitter e com isso o widget está completo e funcionando.

Obs.: O contador de seguidores do Twitter foi programado para ser atualizado de 2 em 2 horas. Além disso vou ter acesso aos usuários desse widget, então pense antes de retirar os créditos. ;D


Com esse post, vou divulgar o widget de assinantes feed + seguidores Twitter. Siga os passos abaixo:



1º- Faça login no Blogger, entre em “Layout” -> “Elementos da página”, clique em “Adicionar um Gadget” -> “HTML/Java Script”

2º - Ao abrir uma janela cole o seguinte código abaixo:

<div align="center">

  <div style='width: 170px; height: 112px; border: 4px #EFEFEF solid;   margin: 0; padding: 0; background: #fff; font-family: "Times New Roman",   Times, serif;'>

  <div style='width: 170px; height: 40px; float: left; padding:   8px;'><img   src="http://codigosblog.net/servidor/widget_twitter+feed/feed-icon.png"   width="40" height="40" style="margin-right: 8px; float: left;"/>   <a href="http://feeds.feedburner.com/NOME_DO_FEED" target="_blank" ><span style="float: left;   margin-top: 2px; padding: 0; font-size: 17px; color: #000066;   font-family: "Times New Roman", Times, serif;">

  <script language='javascript' type='text/javascript'   src='http://www.codigosblog.net/servidor/contadorfeed.php?uri=NOME_DO_FEED'></script>   leitores</span><br/>

  <span style="float: left; margin: 0px; padding: 0px; font-size: 12px;   color: #000066; font-family: "Times New Roman", Times,   serif;">assine o feed</span></a>
  </div>
  <div style='width: 170px; height: 40px; float: left; padding:   8px;'>
  <img   src="http://codigosblog.net/servidor/widget_twitter+feed/twitter-icon.gif"     width="40" height="40" style="margin-right: 8px; float: left;" />
  <a href="http://www.twitter.com/SEU_USUÁRIO_TWITTER"   target="_blank" ><span style="float: left; margin-top: 2px;   padding: 0; font-size: 17px; color: #000066; font-family: "Times New   Roman", Times, serif;">

  <script type='text/javascript'   src="http://www.codigosblog.net/servidor/contadorTwitter/seguidores.php?usuario=SEU_USUÁRIO_TWITTER"></script>   followers</span><br/>

  <span style="float: left; margin: 0px; padding: 0px; font-size: 12px;   color: #000066; font-family: "Times New Roman", Times, serif;">siga   no twitter</span></a>
  </div>
  </div>

  <span style="font-size: 10px; font-family:Arial, Helvetica,   sans-serif; padding: 2px 0px 0px 0px; margin:   0;"><small><script language='javascript'   type='text/javascript'   src='http://www.codigosblog.net/servidor/widget_twitter+feed/widget+codigosblog.js'></script></small></span>
  </div>

Substitua:

• NOME_DO_FEED pelo nome do feed do seu blog.

Exemplo: http://feeds.feedburner.com/codigosblog (no caso o NOME_DO_FEED é: codigosblog)

• SEU_USUÁRIO_TWITTER pelo nome de usuário do seu Twitter.

Exemplo: http://twitter.com/pauloestevao (no caso o SEU_USUÁRIO_TWITTER é: pauloestevao)

Obs.: Coloque o nome de usuário do Twitter todo em letras minúsculas! Se colocar alguma letra maiúscula o widget não vai funcionar.


Lembre-se: Existem quatro modificações a serem feitas.

3º - Depois que modificar é só salvar. Não tem problema algum em modificar o widget, basta não retirar os créditos.

4º - Para o contador de assinantes feed funcionar, você deve liberar a funcionalidade diretamente no FeedBurner.

Entre no site http://www.feedburner.com/ , faça seu login, acesse a conta desejada.

Acesse a aba: “Publicize” (Publicar) e clique em “FeedCount” (FeedCount) localizado no menu lateral. Após isso clique em “Activate” (Ativar).

Pronto! O contador está ativado.