Depuis quelques temps je chercher à optimiser la gestion des tweets en provenance de twitter dans mes commentaires de WordPress. Je souhaitais garder la présence des tweets sans pour autant perturber les discussions. Voici donc quelques optimisations à rajouter à Topsy pour réaliser cette fonctionnalité.

Le plugin Topsy

Tout d’abord, vous devez disposer du plugin Topsy Retweet Button. Personnellement je ne l’utilise que pour la fonction TrackBack Comments que je configure comme ceci :

Trackback Comments de Topsy Retweet Button est bien pratique mais il présente certaines lacunes :

• Pas d’avatar pour les comptes twitter
• Impossibilité de masquer les commentaires issus de Topsy.

Voici donc comment résoudre ces problèmes simplement sans modifier le plugin.

Ajouter une fonction pour identifier les commentaires de Topsy

Cette fonction est à intégrer dans le fichier functions.php de votre thème

// Test si le commentaire est un commentaire de Topsy
// Basée sur le code source de BackType Connect
//
// @param	int	$comment	 Commentaire a tester
// @param	bool	$ret_ID	 Whether or not to return the comment_ID
// @return	bool	 True          si c'est un commentaire Topsy sinon false
//
function sgk_is_topsy_comment($comment, $ret_ID=false) {
	if (substr($comment->comment_agent, 0, 5) == 'Topsy') {
		if ($ret_ID) {
			return $comment->comment_ID;
		}
		return true;
	}
	return false;
}	

Ajouter l’avatar de Twitter aux commentaires Topsy

Pour cela nous allons ajouter la fonction sgk_get_twitter_avatar dans fonctions.php de votre thème, afin de retourner un avatar correct lors de la détection de commentaires en provenance de Topsy.

// Filter avatars pour Topsy comments
// Basée sur le code source de BackType Connect
//
// @uses	sgk_is_topsy_comment()
//
// @param	string	$avatar			avatar courant
// @param	object	$id_or_email	auteur courant du commentaire
// @param	int		$size			taille de l'avatar
// @param	string	$default		        avatar par default
// @param	string	$alt			        Alt tag pour l'avatar avatar
// @return	string					Nouveau avatar
//
function sgk_get_twitter_avatar($avatar, $id_or_email, $size='96', $default='', $alt='') {
	if (!is_object($id_or_email) && $comment_ID = get_comment_ID()) {
		$id_or_email = get_comment($comment_ID);
	}
	if (is_object($id_or_email)) {
		if (sgk_is_topsy_comment($id_or_email)) {
			$alt = '';
			
			if (preg_match("/^https?:\/\/(?:[-\w]+\.)?twitter\.com\/(\w{1,15})/", $id_or_email->comment_author_url, $match)) {
				$tweeter_username = $match[1];
			}
			$default = 'http://img.tweetimag.es/i/' . $tweeter_username . '_n';			
			
			return "<img alt='{$alt}' src='{$default}' class='avatar avatar-{$size} photo' height='{$size}' width='{$size}' />";
		}
	}
	return $avatar;
}

Il faut ensuite déclencher le filtre sur chaque appel global de get_avatar de la boucle wordpress, pour cela il suffit d’ajouter cette ligne dans fonctions.php de votre thème

add_filter('get_avatar', 'sgk_get_twitter_avatar', 10, 5);

Vous disposez maintenant d’avatars Twitter pour vos commentaires Topsy.

Masquer les tweets en provenance de Topsy par defaut

Pour masquer les tweets en provenance de Topsy, il faut d’abord les identifier. On va donc rajouter une classe aux commentaires de Topsy, à l’aide la fonction sgk_comment_class à ajouter dans fonctions.php de votre thème.

// ajout de la classe twitter_comment aux commentaires Topsy
// Basée sur le code source de BackType Connect
//
// @uses	sgk_is_topsy_comment()
//
// @param	string	$classes		        Class attribuées aux commentaires
// @param	string	$class			Class attribute du commentaire
// @param	string	$comment_id		ID du commentaire
// @return							class corrigées pour le commentaire
//
function sgk_comment_class($classes, $class=null, $comment_id=null) {
	if ($comment_id == null) {
		$comment_id = get_comment_ID();
	}
	if ($comment = get_comment($comment_id)) {
		if (sgk_is_topsy_comment($comment)) {
			$classes[] = 'twitter_comment';			
		}
	}
	return $classes;
}

Il faut ensuite déclencher le filtre sur chaque appel global de comment_class de la boucle wordpress, pour cela il suffit d’ajouter cette ligne dans fonctions.php de votre thème

add_filter('comment_class', 'sgk_comment_class', 10, 3);

Vous disposez maintenant de la classe twitter_comment pour vos commentaires Topsy.

Il va falloir masquer ces commentaires à l’aide d’une feuilles de style css comme par exemple style.css de votre thème où il faudra intégrer

.twitter_comment {
display:none;
}

Pour pouvoir afficher vos commentaires à la demande avec un joli effet toggle jQuery

Télécharger jquery-1.2.6.pack.js et enregistrer le dans un répertoire js dans votre thème

Il faudra alors rajouter dans la partie head votre header.php

<!-- Un peu basé sur la fredzone j'avoue -->
<script type="text/javascript" src="js/jquery-1.2.6.pack.js"></script>
<script text="text/javascript"> 
	jQuery(document).ready(  function() { 

		$('#ToggleTweet').click(function() {
			$(".twitter_comment").toggle("slow");
		});

	});
</script> 

Il faut maintenant insérer le déclencheur #ToggleTweet dans votre code pour pouvoir masquer les tweets de Topsy, personnelement je l’ai mis dans comments.php

<h3 id="comments">
	<?php comments_number('Pas de commentaires', 'Un Commentaire', '% Commentaires' );?>
	<span id="ToggleTweet"class="right">Voir les tweets</span>
</h3>

Conclusion

Suite au message « There was a problem registering your plugin with BackType. Please contact support@backtype.com for assistance » dans le plugin BackType Connect, je me suis aperçu que ce plugin n’était plus maintenu au profit d’une utilisation par Disqus. Dommage, ce plugin était bien pratique et assez complet de base.

J’ai donc essayé Disqus et sérieusement, je l’ai trouvé trop lourd et pas assez malléable pour mon utilisation, j’ai donc regardé ce que les autres blogueurs utilisaient, et je suis tombé sur Topsy, cette fois ci un peu trop léger, mais suffisant pour mon utilisation.

Il donc fallut rajouter les quelques fonctionnalités de BackType Connect à Topsy pour les avatars et les classes pour remplir mon besoins.

Les tweets dans les commentaires permettent donc de faire monter le nombres de commentaires sous WordPress, indiquant donc la force d’une information, sans forcement dénaturer la discussions des lecteurs.

That’s All Folks !