Comment ajouter une étiquette de rôle d'utilisateur à côté des commentaires dans WordPress

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 d'une étiquette de rôle d'utilisateur donne du poids aux commentaires des utilisateurs enregistrés sur votre site Web, en particulier des auteurs, des éditeurs et des 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 de rôle d'utilisateur en regard du commentaire Nom de l'auteur dans WordPress?

Si vous autorisez l'enregistrement d'un utilisateur sur votre site Web ou si vous gérez un site Web WordPress à plusieurs auteurs, les libellés d'utilisateur peuvent se présenter les uns aux autres en fonction de leurs rôles..

Par exemple, les utilisateurs dotés du rôle d'utilisateur éditeur affichent un badge à côté de leur nom dans les commentaires, ce qui permet aux autres utilisateurs de savoir 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 de l'auteur du message. Ils n'affichent pas d'étiquettes pour d'autres rôles d'utilisateur, même si d'autres utilisateurs ou des administrateurs de site font des commentaires..

Cela étant dit, examinons 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 commentaire Nom de l'auteur dans WordPress

Ce tutoriel nécessite que vous ajoutiez du code à vos fichiers de thème WordPress. Si vous ne l'avez pas déjà fait auparavant, consultez notre guide sur la manière de copier et coller du code dans WordPress..

La première chose à 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')): classe WPB_Comment_Author_Role_Label fonction publique __construct () add_filter ('get_comment_author', array ($ this, 'wp_get_comment_comment_author_role'), add_filter ('get_comment_author_link', tableau ($ this, 'wpb_comment_author_role'));  // Récupère le rôle de l'auteur du commentaire, fonction wpb_get_comment_author_role ($ author, $ comment_id, $ comment) $ authoremail = get_comment_author_email ($ comment); // Vérifie si l'utilisateur est enregistré si (email_exists ($ authoremail)) $ commet_user_role = get_user_by ('email', $ authoremail); $ comment_user_role = $ commet_user_role-> roles [0]; // sortie HTML à ajouter à côté du commentaire nom d'auteur $ this-> comment_user_role = ''. ucfirst ($ comment_user_role). '';  else $ this-> comment_user_role = "; return $ author; // Afficher la fonction author comment wpb_comment_author_role ($ author) return $ author. = $ this-> comment_user_role; new WPB_Comment_Author_Role_Label; endif; 

Ce code de fonction ci-dessus s'accroche aux filtres WordPress utilisés pour afficher le nom de l'auteur du commentaire afin d'inclure l'étiquette du rôle de l'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 affichera uniquement le nom de l'auteur du commentaire..

Maintenant que nous avons ajouté le rôle d'utilisateur, il est temps de le personnaliser et de lui donner une apparence 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 d'utilisateur (par exemple, utiliser des couleurs différentes, etc.).

Vous pouvez utiliser l'exemple de CSS suivant comme point de départ:

 .comment-author-label padding: 5px; taille de police: 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 guise. 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 voudrez peut-être aussi voir notre guide sur la façon de charger des gravatars paresseux dans les commentaires WordPress.

Si vous avez aimé cet article, abonnez-vous à nos tutoriels vidéo sur la chaîne YouTube pour WordPress. Vous pouvez aussi nous trouver sur Twitter et Facebook.