Comment presque réussir à intégrer les Twitter Cards sur un blog WordPress

Les Twitter Cards, c’est un service que Twitter met à disposition des éditeurs de sites web depuis environ 6 mois. L’objectif : afficher un résumé des articles d’actualité ou prévisualiser des contenus multimédias (image, vidéo, audio). Cette aperçu est une bonne incitation au clic qui a de quoi séduire les webmasters et autres blogueurs.

Comment ça marche ?

L’excellent billet de Marie-George sur Webmarketing-com vous dit tout sur le fonctionnement des Twitter Cards. Mais pour intégrer techniquement les Twitter Cards, c’est une autre paire de manches. Des dizaines d’articles comme celui-ci vous expliquent qu’il y a 2 plugins dédiés à WordPress et vous expliquent la procédure à suivre mais les 2 m’ont planté Choblab ! Même the King of WordPress Roch Daniel semble avoir eu des problèmes. Comment donc intégrer ces foutues Twitter Cards dans WordPress sans utiliser de plugin, mmmh ?

A force de chercher, j’ai trouvé, notamment chez la délicieuse Delicart, ce bout de code à rajouter directement dans le fichier header.php de votre WordPress, juste avant l’élément </head>.

<?php
#twitter cards hack
if(is_single() || is_page()) {
$twitter_url = get_permalink();
$twitter_title = get_the_title();
$twitter_desc = get_the_excerpt();
$twitter_thumbs = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), full );
$twitter_thumb = $twitter_thumbs[0];
if(!$twitter_thumb) {
$twitter_thumb = ‘http://www.gravatar.com/avatar/b9ec4f6447c72d90ad56680cdb5b181a?rating=PG&size=75′;
}
$twitter_name = str_replace(‘@’, » , get_the_author_meta(‘twitter’));
?>
<meta name=» twitter:card»  value=» summary»  />
<meta name=» twitter:url»  value=» <?php echo $twitter_url; ?>»  />
<meta name=» twitter:title»  value=» <?php echo $twitter_title; ?>»  />
<meta name=» twitter:description»  content=» La suite sur Choblab.com car cet article ne tient pas en 140 caract&egrave;res »  />
<meta name=» twitter:image»  value=» <?php echo $twitter_thumb; ?>»  />
<meta name=» twitter:site»  content=» @choblab» >
<meta name=» twitter:creator»  content=» @choblab» >
<?
if($twitter_name) {
?>
<meta name=» twitter:creator»  value=» @<?php echo $twitter_name; ?>»  />
<?
}
}
?>

Pour le personnaliser, il suffit de remplacer choblab par votre nom et de modifier l’URL du gravatar.

L’avantage : ça fonctionne !
L’inconvénient : le petit hic, c’est que je n’arrive pas à remonter le chapô – ou la description, lié à chaque article. Décidément, quand ça veut pas…

Normalement, le code qui affiche automatiquement les premières lignes de votre article est :

<meta name="twitter:description" value="<?php echo $twitter_desc; ?>" />

Comme ce code me posait des soucis d’affichage, je l’ai remplacé par un petit texte générique, car le poète a dit :

l’humour est la politesse du désespoir.

Il vous suffit donc de changer dans le bout de code ci-dessus le texte entre guillemets après content.

Résultat : après avoir soumis le truc à Twitter (oui, comme les antibiotiques, c’est pas automatique), les tweets et retweets mentionnant un article de Choblab affichent presque le résumé du billet et incitent à me suivre !

Si tout ça n’avait pas été si compliqué, j’aurais conclu par une formule autour des joies simples. Là, j’ai juste envie de m’éponger le front…

Si vous n’êtes pas épuisés, lisez également sur ce blog

Twitter : les widgets deviennent plus interactifs

Twitter facilite et optimise l’affichage d’un tweet sur son site web ou son blog