X

Comment créer un modèle de page centrale de commentaires dans WordPress

L’un des moyens d’accroître l’engagement des visiteurs est de récompenser leurs commentaires en les mettant en valeur sur votre site web. En outre, vous pouvez également mettre en avant les meilleurs commentateurs, en créant un lien vers leur site web. Ici, nous allons créer un modèle de page dédié pour afficher ces commentaires et ces commentateurs en un seul endroit.

En bref, ce tutoriel vous apprendra à :

  1. créer un modèle de page,
  2. utiliser des requêtes SQL dans votre code pour récupérer les commentaires avec différents paramètres,
  3. créer une section de la page qui n’est visible que par l’administrateur,
  4. ajouter le support d’un plugin lié aux commentaires.

Création d’un modèle de page

La façon la plus simple de créer un modèle de page est d’ouvrir le fichier page.php de votre thème, qui ressemblera à peu près à ceci :

<?php get_header() ; ?>
  <div id="content">
    <?php if (have_posts()) : while (have_posts()) : the_post() ; ?>
    <div class="post" id="post-<?php the_ID() ; ?>">

    <h2 class="page_title"><?php the_title() ; ?></h2>
      <?php the_content() ; ?>
    </div>
    <?php comments_template() ; ?>
    <?php endwhile ; endif ; ?>
  </div>

<?php get_sidebar() ; ?>
<?php get_footer() ; ?>

Copiez et collez le contenu de page.php et ajoutez ceci tout en haut :

<?php
/*
Nom du modèle : Commentaires centraux
 */
?>

Et sauvegardez-le. Il n’y a pas vraiment de règles pour nommer un fichier de modèle de page, mais c’est une bonne idée d’utiliser un préfixe pour le rendre reconnaissable, par exemple “pt-comment-central.php”. Nous n’avons rien ajouté à ce modèle de page, mais il est opérationnel et sélectionnable dans la zone du tableau de bord “Écrire une nouvelle page”.

Récupérer les commentaires

Pour ce modèle de page, nous allons présenter quatre aspects différents des commentaires :

  • Commentaires récents,
  • Trackbacks / Pingbacks récents,
  • Top Commenters,
  • les articles les plus commentés,

Commençons par les commentaires récents:

<h3>Commentaires récents</h3>  
<ul id="cc-recent-comments">      
<?php
  $max = 7 ; // nombre d'éléments à obtenir
  global $wpdb ;
  $sql = "SELECT c.*, p.post_title FROM $wpdb->comments c INNER JOIN $wpdb->posts p ON (c.comment_post_id=p.ID) WHERE comment_approved = '1' AND comment_type not in ('trackback', 'pingback') ORDER BY comment_date DESC LIMIT $max" ;
  $results = $wpdb->get_results($sql) ;
  
  $template = '%g <a href="%au">%an</a> on <a href="%pu#comment-%cid">%pt</a>' ;
  
  $echoed = 0 ;
  foreach ($results as $row) {
    $tags = array('%ct','%cd','%g','%pt','%pu','%au','%an','%cid') ;
    $replacements = array($row->comment_title,$row->comment_date,get_avatar($row->comment_author_email,'32'),$row->post_title,get_permalink($row->comment_post_ID),$row->comment_author_url,$row->comment_author,$row->comment_ID) ;
    echo '<li>' . str_replace($tags,$replacements,$template) . '</li>' ;
    $echoed = 1 ;
  }
  if ($echoed==0)
      echo '<li>No comment found.</li>' ; 
?>
</ul>

La requête SQL demande tous les commentaires approuvés triés par date (le plus récent en premier). $max est l’endroit où nous fixons le nombre de commentaires à obtenir, 7 dans notre cas. La sortie du code ci-dessus sera une liste non ordonnée de commentaires récents :

List of Recent Comments

Avec un peu de CSS, nous pouvons la redresser pour qu’elle ait un meilleur aspect :

#cc-recent-comments li {
  width : 100% ;
  float : left ;
  list-style-type : none ;
}

#cc-recent-comments li img {
  float : left ;
  margin-top : -5px ;
}

List of Recent Comments with proper CSS

$template détermine la façon dont le texte sera écrit ; il est basé sur le format créé par WP Comment Remix, et vous pouvez suivre ce lien pour en savoir plus sur sa personnalisation (cherchez ‘tokens’).

Ensuite, il y a les Pingbacks / Trackbacks récents:

<h3>Recent Pingbacks / Trackbacks </h3>
<ul id="cc-recent-trackbacks">        
<?php
  $sql = "SELECT c.*, p.post_title FROM $wpdb->comments c INNER JOIN $wpdb->posts p ON (c.comment_post_id=p.ID) WHERE comment_approved = '1' AND comment_type not in ('trackback','pingback') ORDER BY comment_date DESC LIMIT $max" ;
  $results = $wpdb->get_results($sql) ;
  
  $template = '%g <a href="%au">%an</a> on <a href="%pu#comment-%cid">%pt</a>' ;
  
  $echoed = 0 ;
  foreach ($results as $row) {
    $tags = array('%ct','%cd','%g','%pt','%pu','%au','%an','%cid') ;
    $replacements = array($row->comment_title,$row->comment_date,get_avatar($row->comment_author_email,'32'),$row->post_title,get_permalink($row->comment_post_ID),$row->comment_author_url,$row->comment_author,$row->comment_ID) ;
    echo '<li>' . str_replace($tags,$replacements,$template) . '</li>' ;
    $echoed=1 ;
  }
  if ($echoed==0)
    echo '<li>No comment found.</li>' ; 
?>
</ul>

Le code ci-dessus est très similaire à celui que nous avons pour les Commentaires récents, les seules différences étant que nous demandons maintenant des commentaires avec ‘comment_type’ sous ‘pingback’ / ‘trackback’, et que le modèle est également un peu différent. Le modèle est également un peu différent :

List of Recent Pingbacks and Trackbacks

Voici le code pour Top Commenters:

<h3>Top Commenters</h3>
<ul id="cc-top-commenters">
<?php
$sql = "SELECT comment_author, comment_author_url, comment_author_email, count(comment_ID) as comment_count FROM $wpdb->comments WHERE comment_approved = '1' AND comment_type not in ('trackback','pingback') GROUP BY comment_author, comment_author_url, comment_author_email ORDER BY comment_count DESC LIMIT $max" ;
$results = $wpdb->get_results($sql) ;

$template = '<a href="%au">%g %an</a> (%c comments)' ;

$echoed = 0 ;
foreach ($results as $row) {
    $tags = array('%g','%au','%an','%c') ;
    $replacements = array(get_avatar($row->comment_author_email,'32'),$row->comment_author_url,$row->comment_author,$row->comment_count) ;
    echo '<li>' . str_replace($tags,$replacements,$template) . '</li>' ;
    $echoed = 1 ;
}
if ($echoed==0)
    echo '<li>No commenter found.</li>' ; 
?>
</ul>

Rien d’extraordinaire là-dedans. Remarquez cependant la fonction get_avatar(), qui vous donnera le Gravatar de toute personne dont vous aurez spécifié l’adresse électronique. Dans ce cas, nous récupérons l’image de l’avatar en utilisant l’adresse e-mail du commentateur. Avec un CSS similaire à celui que nous avons pour les commentaires récents, nous pouvons obtenir ce résultat :

#cc-top-commenters li {
  width : 100% ;
  float : left ;
  list-style-type : none ;
}

#cc-top-commenters li img {
  float : left ;
  margin-top : -5px ;
}

List of Top Commenters

La dernière est celle des messages les plus commentés:

<h3>Postes les plus commentés</h3>
<ul id="cc-most-comments">
$sql = "SELECT p.*, c.comment_count FROM $wpdb->posts p INNER JOIN (SELECT comment_post_id, count(comment_ID) as comment_count from $wpdb->comments WHERE comment_approved='1' GROUP BY comment_post_id) c ON (c.comment_post_id=p.ID) ORDER BY c.comment_count DESC LIMIT $max" ;
$results = $wpdb->get_results($sql) ;

$template = '<a href="%pu">%pt</a> (%c comments)' ;

$echoed = 0 ;
foreach ($results as $row) {
  $tags = array('%pd','%pt','%pu','%c') ;
  $replacements = array($row->post_date,$row->post_title,get_permalink($row->ID),$row->comment_count) ;
  echo '<li>' . str_replace($tags,$replacements,$template) . '</li>' ;
  $echoed = 1 ;
}
if ($echoed==0)
    echo '<li>No commenter found.</li>' ;
?>
</ul>

List of Most Commented Post

Et c’est tout. Ensuite, nous allons ajouter un peu plus de coolitude en ajoutant des choses que seul l’administrateur peut voir.

Informations réservées à l’administrateur

Pour afficher des informations réservées aux administrateurs, nous pouvons utiliser cet extrait de code de WPCandy :

<?php 
global $user_ID ; 
if( $user_ID ) :
  if( current_user_can('level_10') ) :
  // Ici, il s'agit d'informations réservées aux administrateurs.
  endif ;
endif ; ?>   

Maintenant, sur le tableau de bord, nous avons un aperçu rapide du total des commentaires d’un site, des commentaires approuvés, des commentaires en attente de révision et des spams. Répliquons cela pour notre modèle de page afin de faciliter l’accès aux administrateurs uniquement :

<?php 
  $num_comm = wp_count_comments() ;
?>
Total des commentaires : <a href="<?php bloginfo('wpurl') ; ?>/wp-admin/edit-comments.php ?"><?php echo $num_comm->total_comments ; ?></a>
Approuvé : <a href="<?php bloginfo('wpurl') ; ?>/wp-admin/edit-comments.php?comment_status=approved"><?php echo $num_comm->approved ; ?></a> 
Modéré : <a href="<?php bloginfo('wpurl') ; ?>/wp-admin/edit-comments.php?comment_status=moderated"><?php echo $num_comm->moderated ; ?></a>
Spam : <a href="<?php bloginfo('wpurl') ; ?>/wp-admin/edit-comments.php?comment_status=spam"><?php echo $num_comm->spam ; ?> </a>

Admin

wp_count_comments() est une fonction intéressante qui renvoie un tableau de différents statuts de commentaires. Nous ajoutons également des liens vers la zone d’administration des commentaires.

Ajouter quelques étincelles

Enfin, supposons que vous trouviez un plugin de commentaires sympa que vous voulez incorporer dans ce modèle de page. Au lieu d’ajouter d’autres codes, ajoutons simplement un support pour ce plugin. Pour cet exemple, j’opterai pour le plugin Activity Sparks, qui peut “afficher un graphique de style ‘sparkline’ dans votre barre latérale pour indiquer l’activité des articles et/ou des commentaires”. “Cela me semble très bien.

En général, le fichier readme.txt d’un plugin vous apprend comment l’ajouter dans les fichiers de votre thème. Dans notre cas, le code peut ressembler à ceci :

<?php 
  if(function_exists('activitysparks')) {
    activitysparks(array('dataset'=>'legend','height_px'=>100,'width_px'=>600,'period'=>30,'ticks'=>24)) ;
  }
?>     

ActivitySparks plugin

function_exists() vérifie si une fonction particulière est disponible ; dans notre cas, la fonction activitysparks, qui sera disponible si le plugin a été téléchargé et activé. Si elle est présente, nous affichons le graphique. Dans le cas contraire, notre modèle de page n’affichera rien (mais il fonctionnera toujours correctement, sans erreur).

Résultat et exemple

Un exemple de ce modèle de page est disponible ici. Il utilise les codes que vous voyez ici avec quelques modifications, principalement pour garder la structure HTML cohérente avec le reste du site web. Le code complet de ce modèle de page est disponible sur Pastebin.

Crédits et lectures complémentaires

  • Les codes utilisés pour afficher les différents commentaires récents et les meilleurs commentaires sont tirés du plugin WP Comment Remix. Jetez un coup d’oeil à son code pour apprendre d’autres choses à faire avec les commentaires, comme exclure les commentaires de l’administrateur des meilleurs commentateurs ou comment ne prendre en compte que les commentaires récents. Le modèle $template que nous utilisons pour formater la sortie peut également être appris à partir de cette page.
  • Créer votre propre modèle de page sur le Codex de WordPress.
  • Tutoriel sur l’affichage du contenu réservé aux administrateurs sur WPCandy.
  • Commentaires   laisser une réponse

    1. good

    2. Great tutorial Hafiz!

      And if I’m not wrong this is the first guest post? if so woot!
      Maybe I’ll be next 😛

    3. Definitely some things here that I want to implement on my photoblog once I get it converted to WordPress. Thanks!

      1. Hey Kim, awesome. Let us know how it works out once you implement it.

    4. Great idea, I might implement something like this for my site.

      Just an FYI: instead of doing raw queries, try using this:

      include ( ABSPATH . ‘wp-admin/includes/template.php’ );
      _wp_get_comment_list( ‘approved’, false, 0, 20, 0, ‘comment’ );

      1. Hey Ptah, glad you found it useful. I was actually thinking of implementing a similar page here too because I think it’s a good way to “reward’ good commenters.

        And thanks for the tip about the raw SQL queries. I’m assuming that could essentially replace any instances of code like this?

        $sql = "SELECT p.*, ..."; // and so on
        $results = $wpdb->get_results($sql);

      2. Exactly, _wp_get_comment_list() returns an array of all comments so from there, you would simply run a foreach loop.

      3. Learn something new every day. Will take a good look at that function, thanks Ptah 🙂

    Ajouter un commentaire

    Nous sommes heureux que vous ayez choisi de laisser un commentaire. N'oubliez pas que tous les commentaires sont modérés conformément à notre privacy policy, et que tous les liens sont en nofollow. N'utilisez PAS de mots-clés dans le champ du nom. Engageons une conversation personnelle et constructive.

WordPress Launch Checklist

L'ultime liste de contrôle pour le lancement de WordPress

Nous avons rassemblé tous les éléments essentiels de la liste de contrôle pour le lancement de votre prochain site Web WordPress dans un ebook pratique.
Oui, envoyez-moi le gratuit !