NeoSting.net
Le petit journal d'un passionné de nouvelles technologies et pour le partage de la culture.

(QR Code) de cette page sur neosting.net

Partager...

# Premiers pas : utilisation de l’API twitter sur son blog

Depuis peu, Twitter à lancé sa nouvelle API nommée AnyWhere comme le précise @pressecitron sur son blog. Le principe est de permettre une meilleure intégration des puissantes fonctions du service de micro-blogging en 140 caractères vers votre blog, en utilisant du code javascript.

Réaliser des boutons officiels et proposer rapidement des redirections sous forme d'hovercard vers vos "amis" en écrivant juste @NeoSting (par exemple) fera partie de ce petit tutoriel. Bien sûr, aujourd'hui de nombreuses solutions pour réaliser des intégrations du genre existent déjà grâce à des applications et des extensions non officielles ; c'est donc à vous de voir, d'essayer, et de faire selon vos besoins et envies. Il est quand même bon à savoir que le javascript alourdit vos pages, et que vous pouvez vous contenter de faire un lien normal vers la page twitter de vos "amis", mais c'est aussi une "perte de temps" quand tout ça peut se faire désormais automatiquement.

Une inscription rapide

Pour utiliser l'API AnyWhere de Twitter, il va donc falloir vous créer un compte développeur. Pas de panique, c'est très simple et même rapide. Rendez-vous ici, et cliquez sur Start using it now. Remplissez alors les champs demandés après vous être enregistré avec votre compte (pseudo et mot de passe). Le nom de l'application sera celui que vous voulez. Ensuite, donnez l'adresse de votre blog que vous répèterez aussi dans le champ Callback URL. Voilà, c'est tout. Votre application est née.

Initialisation

Vous allez donc pouvoir commencer à l'utiliser, et donc insérer des fonctions Twitter. Pour cela, vous aurez besoin de votre clé API que vous trouverez ici en cliquant sur votre nouvelle "application" Maintenant, mettez entre les balises HEAD de votre blog le code suivant en remplaçant "YourAPIKey" par la vôtre. Ceci aura pour effet d'initialiser l'appel javascript des fonctions disponibles de twitter AnyWhere, comme vous pouvez le voir ici.

<script src="http://platform.twitter.com/anywhere.js?id=YourAPIKey&v=1" type="text/javascript"></script>

Enfin, vous pouvez regarder les status des différents services twitter pour être sûr que tout est prêt à l'emploi.

Intégration

Pour créer une hovercard automatiquement lorsque vous écrivez @ suivi d'un pseudo, il faut mettre (tout en bas de préférence) avant la fermeture de la balise /BODY ceci

<script type="text/javascript">
twttr.anywhere(function(twitter) {
twitter.hovercards();
});
</script>

Enfin, pour réaliser dans la foulée un bouton invitant vos visiteurs à vous suivre sur Twitter, il faut écrire ceci (toujours en bas, ce qui aura pour incidence de ne charger le script qu'une fois votre page chargée)

<script type="text/javascript">
twttr.anywhere(onAnyWhereLoad);
function onAnyWhereLoad(twitter) {
// this is the callback function you specified in your initializer
twitter('#follow-twitterapi').followButton("NeoSting");
};
</script>

Bien sûr, rien ne vous empêche de rassembler les deux. Pensez à changer "NeoSting" par votre pseudo, aussi, enfin c'est comme vous voulez ! Quant au bouton, n'importe où dans votre thème, où vous voulez qu'il apparaisse il faut écrire ceci (sinon, rien ne se passe)

<div id="follow-twitterapi"></div>

Pourquoi les commentaires sont fermés ?

Articles pouvant vous intéresser

Les articles populaires du moment