Advertisement
  1. Code
  2. WordPress

Démêler les secrets du fichier Comments.php de WordPress

Scroll to top
Gilles Maes
Read Time: 14 min
WordPressWeb Development

French (Français) translation by Abdelhalim Boujemaa (you can also view the original English article)

WordPress semble être partout aujourd'hui, et ce n'est pas étonnant vu sa facilité d'utilisation et sa facilité de personnalisation. Dans ce tutoriel, je vais disséquer la structure comments.php du thème WordPress par défaut et vous donner divers extraits de code pour faciliter votre tâche.

Pour votre référence, j'ai également inclus une petite table de matières.

  1. Le backend PHP
  2. Code général
    1. Empêcher l'accès direct à comments.php
    2. Un mot de passe est-il requis ?
  3. Afficher les commentaires
    1. Tags de template de commentaire de base
    2. Le résultat final
  4. Le formulaire de commentaire
    1. Présentation de la déclaration conditionnelle
    2. Insérer le formulaire
  5. Quelques petites astuces
    1. Gravatars
    2. Nombre de commentaires
    3. Liens de commentaire
    4. Modification des commentaires
    5. Alterner les couleurs pour les commentaires
    6. Afficher les tags autorisés
    7. Lien RSS de commentaires
  6. Conclusion

Le backend PHP 

<?php if(!empty($_SERVER['SCRIPT_FILENAME']) && 'comments.php' == basename($_SERVER['SCRIPT_FILENAME'])) : ?>
<?php endif; ?>
  
<?php if(!empty($post->post_password)) : ?>
	<?php if($_COOKIE['wp-postpass_' . COOKIEHASH] != $post->post_password) : ?>
	<?php endif; ?>
<?php endif; ?>

<?php if($comments) : ?>
	<?php foreach($comments as $comment) : ?>
		<?php if ($comment->comment_approved == '0') : ?>
		<?php endif; ?>
	<?php endforeach; ?>
<?php else : ?>
<?php endif; ?>

<?php if(comments_open()) : ?>
	<?php if(get_option('comment_registration') && !$user_ID) : ?>
	<?php else : ?>
		<?php if($user_ID) : ?>
		<?php else : ?>
		<?php endif; ?>
	<?php endif; ?>
<?php else : ?>
<?php endif; ?>

C'est le code PHP brut qui va faire fonctionner votre fichier comments.php. Pour un novice, cela peut sembler intimidant. Cependant, ne vous inquiétez pas; avec ce tutoriel tout deviendra clair dans votre fichier de commentaires !

Code général

Empêcher l'accès direct à comments.php

<?php if(!empty($_SERVER['SCRIPT_FILENAME']) && 'comments.php' == basename($_SERVER['SCRIPT_FILENAME'])) : ?>
<?php endif; ?>

Cette ligne de code empêche les utilisateurs de voir comment.php par accident. Cette page est destinée à être incluse dans une page de publication, et non pas séparément. Vous pourriez considérer cela comme une mesure de sécurité. À l'intérieur de la déclaration, vous pouvez insérer n'importe quel message que vous souhaitez afficher à la personne qui consulte le fichier comments.php, de préférence une instruction die.

<?php if(!empty($_SERVER['SCRIPT_FILENAME']) && 'comments.php' == basename($_SERVER['SCRIPT_FILENAME'])) : ?>
	<?php die('You can not access this page directly!'); ?>
<?php endif; ?>

Un mot de passe est-il requis ?

<?php if(!empty($post->post_password)) : ?>
	<?php if($_COOKIE['wp-postpass_' . COOKIEHASH] != $post->post_password) : ?>
	<?php endif; ?>
<?php endif; ?>

Cette déclaration (bien, 2 en fait, mais cela a plus de sens si vous les voyez comme un seul) vérifie si un mot de passe est requis pour voir le message. Évidemment, si vous n'avez pas le mot de passe pour voir le message, vous n'êtes pas autorisé à voir les commentaires.

Le premier if vérifie s'il existe un mot de passe. La seconde instruction if vérifie si un cookie avec un mot de passe existe et affiche le message correspondant lorsqu'il n'y est pas. Vous pouvez personnaliser le message d'erreur en plaçant ce que vous choisissez dans la seconde instruction if.

Afficher les commentaires 

<?php if($comments): ?>
  	<?php foreach ($comments as $comment) : ?>
		<?php if ($comment->comment_approved == '0') : ?>
		<?php endif; ?>
	<?php endforeach; ?>
<?php else : ?>
<?php endif; ?>

Cette première instruction conditionnelle (if ($ comments)) vérifie s'il y a des commentaires et les parcourt ensuite avec une instruction foreach. Dans l'instruction foreach, vous remarquerez l'instruction conditionnelle suivante : if ($ comment-> comment_approved == '0'). Cela vérifie si le commentaire a été approuvé et affiche un message s'il n'est pas encore approuvé.

Le morceau de code suivant est un exemple.

<?php if($comments) : ?>
	<ol>
  	<?php foreach($comments as $comment) : ?>
		<li>
			<?php if($comment->comment_approved == '0') : ?>
				<p>Your comment is awaiting approval</p>
			<?php endif; ?>
			<p>Your comment</p>
		</li>
	<?php endforeach; ?>
	</ol>
<?php else : ?>
	<p>No comments</p>
<?php endif; ?>

Tags de template de commentaire de base

Pour en faire un morceau de code fonctionnel, vous devrez utiliser les tags de template fournies par WordPress.

Tag de template Description
<?php comment_ID(); ?> l'ID du commentaire
<?php comment_author(); ?> l'auteur du commentaire
<?php comment_author_link(); ?> l'auteur d'un commentaire, entouré d'un lien vers son site s'il en spécifie un
<?php comment_type(); ?> le type de commentaire: pingback, rétrolien ou un simple commentaire
<?php comment_text(); ?> le commentaire actuel
<?php comment_date(); ?> la date de publication
<?php comment_time(); ?> l'heure de publication

Le résultat final

<?php if($comments) : ?>
	<ol>
  	<?php foreach($comments as $comment) : ?>
		<li id="comment-<?php comment_ID(); ?>">
			<?php if ($comment->comment_approved == '0') : ?>
				<p>Your comment is awaiting approval</p>
			<?php endif; ?>
			<?php comment_text(); ?>
			<cite><?php comment_type(); ?> by <?php comment_author_link(); ?> on <?php comment_date(); ?> at <?php comment_time(); ?></cite>
		</li>
	<?php endforeach; ?>
	</ol>
<?php else : ?>
	<p>No comments yet</p>
<?php endif; ?>

L'insertion de ceci dans comments.php vous donnerait une liste ordonnée avec les commentaires et l'information requise ou afficherait un message indiquant qu'il n'y a aucun commentaire.

Le formulaire de commentaire

Tu me suis toujours ? Bien ! Nous y sommes presque. Nous avons juste besoin de traiter ce formulaire de commentaire ... D'accord, peut-être que j'ai menti à propos d'être presque là. Le formulaire de commentaire est en fait l'une des parties les plus difficiles de l'ensemble du fichier comments.php.

Vous serez bombardé avec plusieurs déclarations conditionnelles (est-ce qu'une connexion est requise, êtes-vous connecté, ...). Cette partie est celle où la plupart des débutants ont le plus de problèmes : les éléments de formulaire mal placés pourraient empêcher le formulaire de fonctionner, sans donner d'erreur PHP spécifique.

Pour vous donner un aperçu des instructions conditionnelles impliquées dans le formulaire de commentaires, j'expliquerai d'abord ces déclarations et inclurai le code HTML plus tard pour expliquer pourquoi il devrait être là.

Présentation de la déclaration conditionnelle

<?php if(comments_open()) : ?>
	<?php if(get_option('comment_registration') && !$user_ID) : ?>
	<?php else : ?>
		<?php if($user_ID) : ?>
		<?php else : ?>
		<?php endif; ?>
	<?php endif; ?>
<?php else : ?>
<?php endif; ?>

La première déclaration conditionnelle que vous rencontrez est <?php if(comments_open()) : ?> Cela vérifie essentiellement si les commentaires sont ouverts. Évidemment, si les commentaires sont fermés, vous ne pouvez pas poster de commentaire et le formulaire de commentaire n'est pas nécessaire. Vous pouvez mettre le message que vous voulez afficher si les commentaires sont fermés entre les derniers <?php else : ?> et
<?php endif; ?> .

La deuxième instruction conditionnelle (<?php if(get_option('comment_registration') && !$user_ID) : ?>) vérifie si vous devez être enregistré pour poster un commentaire et si vous êtes connecté. Si l'instruction conditionnelle est remplie, le script doit afficher un lien vers un endroit où les utilisateurs peuvent se connecter. Si l'inscription n'est pas requise ou que vous êtes déjà connecté, le script continue avec la partie else et affiche le formulaire.

Notre déclaration conditionnelle finale vérifie ensuite si vous êtes connecté ou non. De toute évidence, si vous êtes déjà connecté, il est inutile de vous obliger à remplir à nouveau votre nom, votre adresse e-mail et votre site web.

Insérer le formulaire

Félicitations, nous avons parcouru toutes les instructions conditionnelles dans le fichier comments.php. Maintenant, tout ce qui reste est d'ajouter le formulaire.

La première chose que je peux vous entendre est : où ce formulaire va-t-il commencer ? Eh bien, il suffit de suivre le bon sens. La deuxième instruction conditionnelle vérifie si vous devez être connecté ou pas, par conséquent vous n'aurez à afficher aucun formulaire avant cette déclaration. Ainsi, le formulaire entier est situé à l'intérieur de cette déclaration conditionnelle.

<?php if(comments_open()) : ?>
	<?php if(get_option('comment_registration') && !$user_ID) : ?>
		<p>You must be <a href="<?php echo get_option('siteurl'); ?>/wp-login.php?redirect_to=<?php echo urlencode(get_permalink()); ?>">logged in</a> to post a comment.</p><?php else : ?>
		<form action="<?php echo get_option('siteurl'); ?>/wp-comments-post.php" method="post" id="commentform">
			<?php if($user_ID) : ?>
			<?php else : ?>
			<?php endif; ?>
		</form>
	<?php endif; ?>
<?php else : ?>
	<p>The comments are closed.</p>
<?php endif; ?>

J'ai également jeté le lien vers la page de connexion, tout comme je l'ai trouvé dans le fichier par défaut comments.php. Comme je l'ai déjà dit, la dernière instruction conditionnelle vérifie si vous êtes connecté ou non. Évidemment, les champs de saisie du nom, du courriel et du site web ne sont affichés que si vous n'êtes pas connecté. Jetons un coup d’œil !

<?php if(comments_open()) : ?>
	<?php if(get_option('comment_registration') && !$user_ID) : ?>
		<p>You must be <a href="<?php echo get_option('siteurl'); ?>/wp-login.php?redirect_to=<?php echo urlencode(get_permalink()); ?>">logged in</a> to post a comment.</p><?php else : ?>
		<form action="<?php echo get_option('siteurl'); ?>/wp-comments-post.php" method="post" id="commentform">
			<?php if($user_ID) : ?>
				<p>Logged in as <a href="<?php echo get_option('siteurl'); ?>/wp-admin/profile.php"><?php echo $user_identity; ?></a>. <a href="<?php echo get_option('siteurl'); ?>/wp-login.php?action=logout" title="Log out of this account">Log out &raquo;</a></p>
			<?php else : ?>
				<p><input type="text" name="author" id="author" value="<?php echo $comment_author; ?>" size="22" tabindex="1" />
				<label for="author"><small>Name <?php if($req) echo "(required)"; ?></small></label></p>
				<p><input type="text" name="email" id="email" value="<?php echo $comment_author_email; ?>" size="22" tabindex="2" />
				<label for="email"><small>Mail (will not be published) <?php if($req) echo "(required)"; ?></small></label></p>
				<p><input type="text" name="url" id="url" value="<?php echo $comment_author_url; ?>" size="22" tabindex="3" />
				<label for="url"><small>Website</small></label></p>
			<?php endif; ?>
		</form>
	<?php endif; ?>
<?php else : ?>
	<p>The comments are closed.</p>
<?php endif; ?>

Bien ! Nous y sommes presque ! Nous avons juste besoin d'ajouter quelques simples lignes de code comme une zone de texte et un bouton de soumission. Ceux-ci vont après la dernière instruction conditionnelle, puisqu'elle n'est pas important pour ces éléments si vous êtes connecté ou non.

<?php if(comments_open()) : ?>
	<?php if(get_option('comment_registration') && !$user_ID) : ?>
		<p>You must be <a href="<?php echo get_option('siteurl'); ?>/wp-login.php?redirect_to=<?php echo urlencode(get_permalink()); ?>">logged in</a> to post a comment.</p><?php else : ?>
		<form action="<?php echo get_option('siteurl'); ?>/wp-comments-post.php" method="post" id="commentform">
			<?php if($user_ID) : ?>
				<p>Logged in as <a href="<?php echo get_option('siteurl'); ?>/wp-admin/profile.php"><?php echo $user_identity; ?></a>. <a href="<?php echo get_option('siteurl'); ?>/wp-login.php?action=logout" title="Log out of this account">Log out &raquo;</a></p>
			<?php else : ?>
				<p><input type="text" name="author" id="author" value="<?php echo $comment_author; ?>" size="22" tabindex="1" />
				<label for="author"><small>Name <?php if($req) echo "(required)"; ?></small></label></p>
				<p><input type="text" name="email" id="email" value="<?php echo $comment_author_email; ?>" size="22" tabindex="2" />
				<label for="email"><small>Mail (will not be published) <?php if($req) echo "(required)"; ?></small></label></p>
				<p><input type="text" name="url" id="url" value="<?php echo $comment_author_url; ?>" size="22" tabindex="3" />
				<label for="url"><small>Website</small></label></p>
			<?php endif; ?>
			<p><textarea name="comment" id="comment" cols="100%" rows="10" tabindex="4"></textarea></p>
			<p><input name="submit" type="submit" id="submit" tabindex="5" value="Submit Comment" />
			<input type="hidden" name="comment_post_ID" value="<?php echo $id; ?>" /></p>
			<?php do_action('comment_form', $post->ID); ?>
		</form>
	<?php endif; ?>
<?php else : ?>
	<p>The comments are closed.</p>
<?php endif; ?>

Ce code devrait être assez explicite. Un champ textarea pour le commentaire, un bouton submit, un champ de saisie caché avec l'identifiant futur des commentaires et un extrait PHP (<?php do_action('comment_form', $post->ID); ?>) WordPress nécessite de faire la fonction de formulaire de commentaire.

Voila ! C'est tout ! Vous avez maintenant votre fichier comments.php entièrement prêt. Consultez ce fichier pour obtenir tout le code PHP et HTML requis. Vous devriez vous retrouver avec ceci (j'ai simplement remplacé le fichier comments.php de l'habillage par défaut par le nôtre et ajouté un style mineur.)

Comments previewComments previewComments preview

Quelques petites astuces

Bien sûr, vous n'avez qu'un fichier comments.php de base. Il y a des tonnes de choses que vous pourriez faire pour l'améliorer davantage. Je vais énumérer quelques petits trucs et astuces pour vous aider dans votre chemin.

Gravatars

À partir de WordPress 2.5, il existe un template WordPress personnalisée pour intégrer des gravatars. Il tire le gravatar de l'email que le visiteur a entré. Le code pour le faire est très simple.

<?php echo get_avatar($author_email, $size, $default_avatar ); ?>

Vous pouvez remplacer $author_email par la fonction get_comment_author_email();   $size est la hauteur (et la largeur) de l'avatar et $default_avatar est un lien vers l'image par défaut d'avatar (affiché lorsque le commentateur n'a pas de gravatar).

Insérez ce code dans la boucle foreach qui affiche les commentaires. L'output est une image avec les classes avatar et avatar-$size (où $size est la taille que vous avez spécifiée). Avec quelques modifications CSS mineures, vous pourriez vous retrouver avec quelque chose comme ça :

Comment GravatarsComment GravatarsComment Gravatars

Nombre de commentaires

J'ai délibérément laissé de côté les en-têtes dans le fichier comments.php que nous avons créé pour plus tard, car je pensais qu'ils feraient en sorte que l'excès de code dans un processus d'apprentissage soit déjà assez difficile. Évidemment, je ne les ai pas oublié.

Habituellement, les gens ont un titre affichant quelque chose de similaire à "3 commentaires jusqu'à présent". C'est vraiment facile à réaliser grâce aux tags de template de WordPress.

<?php comments_number($zero_comments, $one_comment, $more_comments); ?>

C'est plutôt explicite : $zero_comments est le texte à afficher lorsqu'il n'y a pas de commentaires, $one_comment lorsqu'il y a un commentaire et $more_comments lorsqu'il y a plusieurs commentaires. Voici un exemple concret :

<?php comments_number('No comments', 'One comment', '% comments'); ?>

J'ai utilisé % pour plusieurs commentaires, puisque la fonction comments_number remplace alors le % par le nombre de commentaires (2, 3, ...)

Utilisé dans notre fichier comments.php, vous vous retrouverez avec quelque chose comme ça :

Comment numbersComment numbersComment numbers

Pour afficher un lien vers la partie commentaires (avec le nombre de commentaires affichés), utilisez simplement le code suivant.

<?php comments_popup_link($zero_comments, $one_comment, $more_comments, $css_class, $comments_closed); ?>

Les 3 premiers paramètres de cette fonction sont les mêmes que la fonction comments_number ci-dessus. $css_class est évidemment la classe CSS que vous donnez au tag <a> et $comments_closed est le texte qui doit être affiché lorsque les commentaires sont fermés. En appliquant ceci à un thème, c'est une manière possible de l'utiliser.

<?php comments_popup_link('No comments', 'One comment', '% comments', 'comments-link', 'Comments are closed'); ?>

Cela vous donnerait alors un lien avec la classe comments-link.

Modification des commentaires

Parfois, vous voudrez modifier un commentaire immédiatement . Heureusement, avec la fonction "dit_comment_link", vous pouvez facilement aller sur la bonne page pour l'éditer, au lieu d'avoir à naviguer vers votre panneau d'administration pour finalement trouver ce commentaire. L'utilisation est comme suit :

<?php edit_comment_link($link_text, $before_link, $after_link); ?>

Vous devez mettre cela dans la boucle de commentaire foreach. Les paramètres sont assez évidents : $link_text est le texte d'ancrage pour le lien d'édition, $before_link et $after_link sont respectivement le texte ou le code à afficher avant ou après le lien.

Cela rend vraiment facile de changer un commentaire. Vous pouvez simplement ajouter un petit lien "Modifier" à votre méta-information de commentaire (visible uniquement par l'administrateur). Voici à quoi cela pourrait ressembler :

Comment Edit LinkComment Edit LinkComment Edit Link

Alterner les couleurs pour les commentaires

Il est possible que vous souhaitiez alterner les couleurs des lignes pour vos commentaires, pour une séparation plus claire. C'est relativement simple. Tout d'abord, ajoutez le code suivant en haut de la page :

function alternate_rows($i){
	if($i % 2) {
		echo ' class="alt"';
	} else {
		echo '';
	}
}

Ajoutez ensuite ce qui suit dans la boucle foreach (à nouveau). Vous pouvez simplement remplacer <li id="comment-<?php comment_ID(); ?>"> avec ça :

<?php $i++; ?>
<li<?php alternate_rows($i); ?> id="comment-<?php comment_ID(); ?>">

Cela donnera à tous les autres commentaires la classe alt, permettant ainsi de changer leur apparence via CSS.

J'ai décidé d'en faire une fonction afin avoir moins d'encombrement dans votre fichier de thème. Vous pouvez ajouter la définition de la fonction dans votre fichier functions.php si vous le souhaitez, mais il est plus logique, pour moi, de l'avoir en haut de votre page.

L'alternance des lignes facilite la distinction des différents commentaires. Une fois implémenté, vous pourriez avoir quelque chose comme ça :

alternate color commentsalternate color commentsalternate color comments

Afficher les tags autorisés

Pour afficher le code que les visiteurs sont autorisés à utiliser dans leurs commentaires, utilisez simplement ce petit extrait.

Allowed tags: <?php echo allowed_tags(); ?>

Ensuite, vous obtiendrez simplement une liste des tags qui sont autorisés dans vos commentaires, comme ceci :

allowed tagsallowed tagsallowed tags

Lien RSS de commentaires

Pour obtenir un lien vers le flux RSS pour les commentaires d'un certain article, il suffit d'insérer le code ci-dessous dans votre fichier comments.php dans l'endroit où vous voulez qu'il soit.

<?php comments_rss_link($link_text); ?>

Ensuite, remplacez simplement $link_test par le texte d'ancrage pour le lien RSS.

Cela peut être utile si vous voulez donner à vos visiteurs la possibilité de s'abonner au flux de commentaires pour un article ou une publication de blog spécifique. Vous pourriez l'implémenter comme suit :

comments rss linkcomments rss linkcomments rss link

Conclusion

J'espère que vous avez apprécié ce petit article sur le fichier WordPress comments.php. Vous pouvez obtenir le code complet ici, avec les astuces que j'ai montré inclus :

  • gravatars
  • couleurs de rang alternées
  • modification de lien
  • lien rss de commentaires

Évidemment, le lien des commentaires n'est pas inclus car il doit être utilisé à l'intérieur de la boucle.

Bonne chance dans vos aventures de personnalisation de WordPress !

Advertisement
WordPressWeb Development
Did you find this post useful?
Want a weekly email summary?
Subscribe below and we’ll send you a weekly email summary of all new Code tutorials. Never miss out on learning about the next big thing.
Gilles Maes
Gilles Maes
Gilles Maes is a Belgian webdeveloper with a particular passion for everything that is related to WordPress. Aside from front-end development with xHTML, CSS and Javascript he also fools around in PHP.
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.
WordPress Plugins
From $5
PHP Scripts
From $5
JavaScript
From $3
Mobile App Templates
From $5
Unlimited Downloads
From $16.50/month
Get access to over one million creative assets on Envato Elements.
Over 9 Million Digital Assets
Everything you need for your next creative project.
Create Beautiful Logos, Designs
& Mockups in Seconds
Design like a professional without Photoshop.
Join the Community
Share ideas. Host meetups. Lead discussions. Collaborate.
Quick LinksExplore popular categories