Le bouton Twitter: comment cacher du code sale dans du code propre.
C’est le nouveau gadget du moment, le bouton Tweeter, made by Twitter. Sortit il y a peu, il commence à envahir internet, comme la fait avant lui le bouton « j’aime » de Facebook.
Comme j’apprécie particulièrement ce réseau, j’ai moi aussi décidé d’ajouter ce bouton à ce blog, il trône fièrement sur tout les articles. Mais je ne l’aime pas particulièrement.
Comme vous pouvez le voir, le style du bouton ne s’accorde pas vraiment avec le design du site, je me suis donc demandé si je ne pouvais pas le personnaliser. La réponse est non, ce n’est pas possible.
Pourtant, le code html fourni par twitter laisse penser le contraire:
<a href= »http://twitter.com/share » class= »twitter-share-button » data-count= »vertical » data-via= »Phenix » data-lang= »fr »>Tweet</a>
<script type= »text/javascript » src= »http://platform.twitter.com/widgets.js »></script>
Une balise <a> et un javascript, rien de bien méchant, mais surtout la possibilité théorique de mettre du CSS dessus. Ce code est également valide (seulement html5 corrigé moi si je me trompe). Et bien, vous pouvez mettre ce que vous voulez dans votre css, ce bouton ne changera jamais d’aspect.
En réalité, Twitter utilise ce que j’appellerai un tour de passe-passe:
Les moteurs de recherche aime les pages valide W3C. Donc le bouton doit être valide, sinon les webmaster ne vont pas en vouloir. Mais si il est valide, cela veux aussi dire qu’on peu le modifier. Hors pour certaines raison, Twitter semble vouloir interdire cette possibilité, probablement pour pouvoir dire: « Ceci est le bouton officiel ». Ce qui est ridicule: si je veux piéger des gens avec le bouton officiel de Twitter, je n’ai qu’a le recréer à l’identique.
Ce qui ce passe en vrai
En réalité, les moteurs de recherche et les autres robots qui aime que les pages soit valides, n’exécute pas le javascript. le javascript de Twitter sert donc à remplacer la belle balise <a> par une horrible iframe absolument invalide.
Un petite capture d’écran ?
Un tour de passe-passe, Twitter ce fiche complètement du W3C et ne laisse aucune place à la bidouille, bien sur, votre site est valide en apparence, mais en réalité, grâce au javascript, il ne l’est plus. Dire qu’on ce bat déjà pour que tout les navigateurs respectent règles si en plus il va falloir ce battre pour que des gros acteurs d’Internet les respects aussi, la bataille n’est vraiment pas gagnée… Je ne suis pas sur d’apprécier ce genre de procédé…
J’imagine que le bouton « J’aime » de facebook fonctionne sur le même principe, mais je ne risque pas de l’intégrer celui là !
Bonjour,
j’essaye en vain de modifier l’aspect de mon bouton Twitter, je viens au nouvelle pour savoir si ce bulletin est toujours d’actualité ou si vous avez trouvé un moyen de le personnaliser ?
Amicalement,
Stone
Re-bonjour,
Voilà j’ai enfin réussi à modifier l’aspect du bouton twitter :
le code :
il faut bien sûr dans votre css déclaré la class .twitter comme bon vous semble.
NOTA : on peut egalement ajouter d’autres variable à l’url comme : via…
Amicalement
Je ne me suis plus penché sur le problème depuis, mais j’ai vu que certains sites arrivaient à changer l’aspect, ou en tout cas utiliser le share.php. Mais ce n’est pas bien compliqué.
Maintenant, je n’ai encore vu personne changer l’aspect ET avoir le compteur de tweet.
Ce que je voudrais surtout, c’est changer l’aspect en garant le compteur.