WordPress 2.7: Personnaliser l’affichage des commentaires

L’une des nouveautés marquantes de WordPress 2.7 est l’amélioration de la gestion des commentaires. Cela se traduit par des possibilités nouvelles pour les utilisateurs et pour les administrateurs. Du côté développement, l’API s’est largement étoffée de fonctions de plus haut niveau. Ces fonctions génèrent un code HTML standardisé, ce qui peut gêner ceux qui avaient fortement personnalisé leur template comments.php. Les possibilités de personnalisation sont cependant bien présentes.
Je vous propose de les découvrir.

Migration

Un petit mot, avant de commencer, sur la compatibilité des thèmes avec WordPress 2.7.

Compatibilité ascendante

Depuis quelques jours, nous voyons apparaître de très nombreux articles indiquant comment rendre les thèmes compatibles avec la version 2.7 de WordPress.

Précisons cette notion de compatibilité: Toutes les fonctions de gestion des commentaires, utilisées dans les versions précédentes restent présentes, et fonctionnent parfaitement en 2.7. Les thèmes développés pour une plateforme 2.4 et + sont donc parfaitement utilisables avec cette nouvelle version, sans aucun changement, mais ils ne permettront simplement pas d’accéder aux nouvelles fonctionnalités (commentaires imbriqués …).

Donc, dans un premier temps, si vous migrez en version 2.7, vous avez deux choix possibles:

• Ne pas activer les nouvelles fonctionnalités des commentaires, et conserver le thème tel qu’il est aujourd’hui. Tout fonctionnera exactement comme avant,
• Activer ces nouvelles fonctionnalités, et modifier le thème en utilisant la nouvelle API.

Dans le second cas, la méthode la plus rapide est de prendre le fichier comments.php du thème default de la version 2.7 de WordPress.

A plus long terme, il est fortement conseillé d’adapter les thèmes: nous ne savons pas combien de temps, les développeurs de WordPress garantiront la compatibilité avec les anciennes fonctions.

Thèmes compatibles avec toutes les versions

Dans un thème, les commentaires s’affichent en général avec les articles ou les pages. Dans les fichiers single.php et page.php, nous avons donc la fonction comments_template(),
qui charge le fichier comments.php.

Pour produire des thèmes qui soient compatibles à la fois avec les versions 2.7 et avec les anciennes versions, j’ai identifié principalement trois méthodes:

• Modifier le fichier comments.php, pour qu’il tienne compte des différentes versions possibles de WordPress,
• Remplacer ce même fichier par une instruction qui appelle des templates adaptées,
• Modifer le comportement de la fonction comments_template(), pour qu’elle demande le chargement d’une template adaptée à chaque version.

Le premier cas est simple: vous partez du fichier comments.php d’origine, et vous y ajoutez une condition du type

<?php if (function_exists('wp_list_comments')) {
    // new comments.php stuff
} else {
    // old comments.php stuff
}
?>

Source: Otto
Pour la seconde solution, il faut

• Renommer le fichier comments.php en legacy-comments.php,
• Créer la template des commentaires pour la version 2.7, new_comments.php par exemple
• Transformer comments.php de la façon suivante:

<?php if (function_exists('wp_list_comments')) {
    include(TEMPLATEPATH . 'new-comments.php');
} else {
    include(TEMPLATEPATH . 'legacy-comments.php');
}
?>

La troisième solution, proposée par Justin TadLock me semble la plus efficace:

• Renommer le fichier comments.php and legacy-comments.php,
• Créer la template comments.php pour la version 2.7
• Modifier le comportement de la fonction comments_template(). Il faut pour cela, ajouter dans le fichier functions.php, le code suivant:

<?php add_filter('comments_template', 'legacy_comments');
function legacy_comments($file) {
    if(!function_exists('wp_list_comments'))  $file = TEMPLATEPATH . '/legacy-comments.php';
    return $file;
}
?>

Si la fonction wp_list_comments() existe, nous sommes en WordPress 2.7, la fonction comments_template() chargera le fichier comments.php (comportement par défaut).

Si wp_list_comments() n’existe pas, alors la fonction chargera le fichier legacy-comments.php.

Personnalisation

La fonction wp_list_comments() affiche la liste des commentaires. Elle remplace avantageusement la boucle foreach ($comments_list as $comment) ....

wp_list_comments() propose cependant un code HTML relativement standardisé: la personnalisation s’arrête au choix de la liste: ol, ul, ou div.
L’utilisation des très nombreux styles CSS, permet d’effectuer un premier niveau de personnalisation. Nous pouvons, par exemple,

• différencier les lignes paires et impaires (classes odd et even),
• signaler les commentaires provenant de l’auteur de l’article (classes bypostauthor
• afficher différemment les commentaires des utilisateurs du blog (classes byuser.

Otto propose une liste de style (paragraphe Styling).

Pour aller plus loin, il est également possible de personnaliser le code généré par wp_list_comments() elle-même. Pour découvrir ces possibilités, il faut regarder ce qu’elle contient. Cette fonction:

• Requête la base pour récupérer les commentaires,
• Fait appel à un objet appelé Walker pour afficher la liste des commentaires précédemment récupérés. Cet objet est un afficheur de liste.

Cet objet Walker est issu de la classe Walker_Comment, qui contient les méthodes suivantes:

• start_el : affiche le début, et le corps d’un commentaire,
• end_el : génère la fin d’un commentaire,
• start_lvl : affiche le début d’un commentaire, lorsqu’il s’agit d’un commentaire de niveau 2 ou plus,
• end_lvl génère la fin d’un commentaire, lorsqu’il s’agit d’un commentaire de niveau 2 ou plus,

La personnalisation consiste donc à surcharger la classe Walker_Comment, et à ré-écrire les fonctions start_el, end_el, start_lvl ou end_lvl.

La méthode de personnalisation est la suivante:

• Création d’une classe Walker, dans un plugin, ou dans le fichier functions.php,
• Dans le fichier comments.php, création d’une instance de la classe, et appel de la fonction wp_list_comments() en spécifiant le nouveau Walker en paramètre.

Exemple: Pour notre liste de commentaires, nous souhaitons utiliser les balises dl, dt, dd, au lieu des habituelles balises ul, ol, li.

Première étape: ouvrir le fichier comments.php, et remplacer la ligne

<ol class="commentlist">
<?php wp_list_comments(); ?>
</ol>

Par les lignes suivantes:

<dl class="commentlist">
<?php
    $my_walker_comment = new MY_Walker_Comment();
    wp_list_comments(array('walker' => $my_walker_comment));
?>
</dl>

Seconde étape, créer la classe MY_Walker_Comment. Dans cette exemple, la classe sera créée dans le fichier functions.php.

<?php
class MY_Walker_Comment extends Walker_Comment {
 
    function start_lvl(&$output, $depth, $args) {
        $GLOBALS['comment_depth'] = $depth + 1;
        echo '<dl class="children">';
    }
 
    function end_lvl(&$output, $depth, $args) {
        $GLOBALS['comment_depth'] = $depth + 1;
        echo '</dl>';
    }
 
    function start_el(&$output, $comment, $depth, $args) {
        $depth++;
        $GLOBALS['comment_depth'] = $depth;
 
        if ( !empty($args['callback']) ) {
            call_user_func($args['callback'], $comment, $args, $depth);
            return;
        }
 
        $GLOBALS['comment'] = $comment;
        extract($args, EXTR_SKIP);
?>
        <dt <?php comment_class(); ?>>
            <?php printf(__('<cite>%s</cite>'), get_comment_author_link()) ?>
            <br />
            <?php printf(__('%1$s <br /> %2$s'), get_comment_date('j M Y'),  get_comment_time()) ?>
            <br />
            <?php edit_comment_link('Edit','  ','') ?>
            <br />
            <div class="reply">
                <?php comment_reply_link(array_merge( $args, array('add_below' => $add_below, 'depth' => $depth, 'max_depth' => $args['max_depth']))) ?>
            </div>
        </dt>
        <dd>
            <?php comment_text() ?>
        </dd>
<?php
    }
 
    function end_el(&$output, $comment, $depth, $args) {
        $GLOBALS['comment_depth'] = $depth + 1;
 
        echo '</dl>';
    }
?>

Le code précédent reste volontairement simple, et ne traite pas tous les cas.
La surcharge de ces méthodes générera le code HTML suivant, lors de l’affichage des commentaires:

<dl class="commentlist">
    <dt class="comment ..." >
        <cite>Lien vers l'auteur</cite><br />
        30 Oct 2008<br />
        18:30
        <div class="reply">
            Lien to reply
        </div>
    </dt>
    <dd>
        Texte du commentaire
    </dd>
    <dt class="comment ..." >
        <cite>Lien vers l'auteur</cite><br />
        30 Oct 2008<br />
        19:30
        <div class="reply">
            Lien to reply
        </div>
    </dt>
    <dd>
        Texte du commentaire
        <dl class="children">
            <dt class="comment ..." >
                <cite>Lien vers l'auteur</cite><br />
                5 Nov 2008<br />
                1:24<br />
                <div class="reply">
                    Lien to reply
                </div>
            </dt>
            <dd>
                Essai de Reply
            </dd>
        </dl>
    </dd>
    <dt class="comment ..." >
        <cite>Lien vers l'auteur</cite><br />
        30 Oct 2008<br />
        18:30
        <div class="reply">
            Lien to reply
        </div>
        </dt>
        <dd>
            Texte du commentaire
        </dd>
    </div>

Nous avons bien maintenant, une liste de commentaires utilisant les balises dl, dt et dd.

Conclusion

Pour la gestion des commentaires, la nouvelle API proposée par WordPress 2.7 permet un développement plus rapide de la template comments.php, tout en prenant en compte les nouvelles fonctionnalités.
Nous pouvions craindre que l’utilisation de fonctions de plus au niveau, entraîne des contraintes supplémentaires pour les développeurs. Comme nous venons de le voir, il n’en n’ai rien. Les personnalisations restent possibles

• En utilisant les styles CSS, beaucoup plus nombreux que dans les versions précédentes,
• En surchargeant les classes existantes: l’opération n’est pas forcement très simple, mais pas plus complexe que la modification du code de la template comments.php nécessaires dans les versions précédentes.