Un de nos lecteurs a demandé s’il était possible de mettre en évidence le rôle de l’utilisateur à côté de chaque commentaire dans WordPress ? L’affichage de l’étiquette de rôle d’utilisateur donne du poids aux commentaires faits par les utilisateurs enregistrés sur votre site Web, en particulier les auteurs, les éditeurs et les administrateurs. Dans cet article, nous allons vous montrer comment ajouter facilement une étiquette de rôle d’utilisateur à côté des commentaires dans WordPress.
Pourquoi afficher l’étiquette du rôle de l’utilisateur à côté du nom de l’auteur du commentaire dans WordPress ?
Si vous autorisez l’enregistrement des utilisateurs sur votre site Web ou exécutez un site Web WordPress multi-auteurs, les étiquettes d’utilisateurs peuvent présenter les utilisateurs les uns aux autres en fonction de leurs rôles d’utilisateur.
Par exemple, les utilisateurs ayant le rôle d’utilisateur d’éditeur afficheront un badge à côté de leur nom dans les commentaires indiquant aux autres utilisateurs que ce commentaire a été fait par un éditeur.
Il renforce la confiance des utilisateurs et augmente l’engagement des utilisateurs dans les commentaires sur votre site Web.
De nombreux thèmes WordPress ne mettent en évidence que les commentaires faits par l’auteur du message. Ils n’affichent les étiquettes pour aucun autre rôle d’utilisateur, même si d’autres commentaires sont faits par des utilisateurs enregistrés ou des administrateurs de site.
Cela étant dit, voyons comment ajouter facilement une étiquette de rôle d’utilisateur à côté des commentaires dans WordPress.
Ajout d’une étiquette de rôle d’utilisateur à côté du nom de l’auteur du commentaire dans WordPress
Ce didacticiel nécessite que vous ajoutiez du code à vos fichiers de thème WordPress. Si vous ne l’avez pas encore fait, veuillez consulter notre guide sur la façon de copier et coller facilement du code dans WordPress.
La première chose que vous devez faire est d’ajouter le code suivant au fichier functions.php de votre thème ou à un plugin spécifique au site.
if ( ! class_exists( 'WPB_Comment_Author_Role_Label' ) ) : class WPB_Comment_Author_Role_Label { public function __construct() { add_filter( 'get_comment_author', array( $this, 'wpb_get_comment_author_role' ), 10, 3 ); add_filter( 'get_comment_author_link', array( $this, 'wpb_comment_author_role' ) ); } // Get comment author role function wpb_get_comment_author_role($author, $comment_id, $comment) { $authoremail = get_comment_author_email( $comment); // Check if user is registered if (email_exists($authoremail)) { $commet_user_role = get_user_by( 'email', $authoremail ); $comment_user_role = $commet_user_role->roles[0]; // HTML output to add next to comment author name $this->comment_user_role=" <span class="comment-author-label comment-author-label-".$comment_user_role.'">' . ucfirst($comment_user_role) . '</span>'; } else { $this->comment_user_role=""; } return $author; } // Display comment author function wpb_comment_author_role($author) { return $author .= $this->comment_user_role; } } new WPB_Comment_Author_Role_Label; endif;
Ce code de fonction ci-dessus se connecte aux filtres WordPress utilisés pour afficher le nom de l’auteur des commentaires afin d’inclure l’étiquette du rôle d’utilisateur.
Vous pouvez maintenant visiter n’importe quel article avec des commentaires pour le voir en action. Les commentaires faits par les utilisateurs enregistrés afficheront leur rôle d’utilisateur à côté du nom de l’auteur du commentaire. Tout commentaire fait par des utilisateurs non enregistrés n’affichera que le nom de l’auteur du commentaire.
Maintenant que nous avons ajouté le rôle d’utilisateur, il est temps de le styliser et de lui donner un aspect propre.
Dans notre code, nous avons ajouté une classe CSS pour chaque rôle d’utilisateur, nous pouvons donc utiliser ces classes CSS pour personnaliser chaque badge utilisateur différemment (c’est-à-dire utiliser des couleurs différentes, etc.)
Vous pouvez utiliser l’exemple de CSS suivant comme point de départ :
.comment-author-label { padding: 5px; font-size: 14px; border-radius: 3px; } .comment-author-label-editor { background-color:#efefef; } .comment-author-label-author { background-color:#faeeee; } .comment-author-label-contributor { background-color:#f0faee; } .comment-author-label-subscriber { background-color:#eef5fa; } .comment-author-label-administrator { background-color:#fde9ff; }
N’hésitez pas à ajuster le CSS à votre convenance. Voici à quoi cela ressemblait sur notre site de démonstration :
Nous espérons que cet article vous a aidé à apprendre comment ajouter une étiquette de rôle d’utilisateur à côté des commentaires dans WordPress. Vous pouvez également consulter notre guide sur la façon de charger paresseux des gravatars dans les commentaires WordPress.