FR US DK DE ES IT KR

jeudi 11 juin 2009

Ajouter un compteur de followers Twitter sur Blogger :)

compteur - twitter - followers - blogger - json - javascript : ajouter le nombre de followers de votre twitter sur un blog bloggerCe lundi, j'ai pensé à vous proposer un petit bout de code pour afficher le nombre de followers twitter. Car cela faisait un moment que je n'avais pas écrit un billet "sérieux". Par faute de temps, j'ai repoussé le billet jusqu'à maintenant... Hier en lisant mes flux rss, Christophe l'a écrit sur son blog Techtrends - Intégrer un Twitter-counter sexy à votre blog. Ça, c'est de la transmission de pensée ;)


Je vais donc orienter son code (merci ;) pour les utilisateurs de blogger. L'ajout de ce compteur se fait en 2 étapes.

0. N'oubliez pas de faire une sauvegarde de votre modèle.

1. Insertion du code Javascript
Allez dans votre Tableau de bord ensuite Mise en page puis Modifier le code HTML et enfin copier/coller le script ci-dessous à l'endroit désiré.
<script type='text/javascript'>function twitterCounter(twitters) { var usercount = twitters[0].user.followers_count
document.getElementById('twitter_counter').innerHTML = usercount; }</script><a href='http://twitter.com/toin0u'>Déjà <span id='twitter_counter'/> followers sur Twitter !</a><script src='http://twitter.com/statuses/user_timeline/toin0u.json?callback=twitterCounter&amp;count=1' type='text/javascript'/>
NB: changez toin0u par votre identifiant twitter ;)

2. Insertion du code CSS
2.a. Recherchez (ctrl-f)
<![CDATA[/*
2.b. Collez en dessous
#twitter_counter {
font-size: 22px;
color: #08ADEF;
}
NB: laissez aller votre imagination & créativité ;)
2.c. Sauvegardez votre modèle

Voilà, c'est terminé :) Si vous rencontrez un problème, je suis à votre écoute. Pour les explications "technique", je vous invite à lire le billet de Christophe :)

4 Commentaires

11 juin 2009 05:24   Olivier a dit…

Tu pourrais faire un widget, feignasse :p

13 juin 2009 00:32   tOiN0U a dit…

Lol Oli, oui, pourquoi pas ;) J'y ai pensé en écrivant le billet :p

21 juin 2009 15:00   Bingo a dit…

Sympa le code, merci !
Je vais l'ajouter pour un de mes blogs sur blogger

24 juin 2009 02:33   tOiN0U a dit…

De rien Bingo :)
++

Ce billet vous a plu ?

Message plus récent Message plus ancien Accueil
^
adresse email TopAsie CC License whos.amung.us
Template reworked by acKorea & hosted by Google
posts and comments since 2007 :')