Vous souhaitez mettre en avant les commentaires de l’auteur dans les publications WordPress de votre site Web ?
Mettre en évidence les commentaires de l’auteur dans votre blog WordPress peut vous aider à renforcer l’engagement. Les utilisateurs sont plus susceptibles de laisser un commentaire lorsqu’ils voient que l’auteur participe activement à la discussion.
Dans cet article, nous allons vous montrer comment mettre facilement en évidence les commentaires de l’auteur dans WordPress pour stimuler l’engagement.
Pourquoi mettre en évidence les commentaires de l’auteur dans WordPress ?
Les commentaires sont un excellent moyen de susciter l’engagement des utilisateurs sur votre site Web. Si vous souhaitez obtenir plus de commentaires sur vos articles, vous pouvez l’encourager en participant activement aux discussions.
Pour un nouveau blog WordPress, vous pouvez facilement répondre aux commentaires lors de la modération des commentaires. Si vous gérez un blog multi-auteurs, vous pouvez également encourager les auteurs à participer à la discussion.
Cependant, la plupart des thèmes WordPress ne font pas la distinction entre les commentaires et les répertorient en utilisant le même style.
Un lecteur occasionnel peut faire défiler les commentaires, sans se rendre compte du contenu supplémentaire apporté par l’auteur dans la discussion.
La mise en surbrillance des commentaires de l’auteur vous aide à y remédier et permet aux commentaires de l’auteur de se démarquer et d’être plus visibles.
Le but ultime ici est d’encourager les nouveaux utilisateurs à se joindre aux commentaires et finalement à s’abonner à votre newsletter ou à devenir client.
Cela étant dit, voyons comment mettre facilement en évidence les commentaires des auteurs dans WordPress.
Mettre en évidence l’auteur de commentaires dans WordPress
Le moyen le plus simple de mettre en évidence les commentaires de l’auteur de la publication est d’ajouter un CSS personnalisé à votre thème WordPress. Cela vous permet d’ajouter facilement le code nécessaire et de voir un aperçu en direct de son apparence sur votre site Web sans l’enregistrer.
Tout d’abord, vous devez visiter Apparence » Personnaliser dans la zone d’administration de WordPress. Cela lancera l’interface de personnalisation du thème WordPress. Vous remarquerez un tas d’options dans une colonne sur votre gauche et un aperçu en direct de votre site Web.
De là, vous devez cliquer sur l’onglet CSS supplémentaire. Cela ouvrira une zone de texte où vous ajouterez le CSS personnalisé.
Cependant, vous voudriez voir à quoi ressemblera le CSS personnalisé une fois appliqué. Pour ce faire, vous devez accéder à un article de blog qui contient les commentaires d’un auteur d’article.
Faites défiler jusqu’à la section des commentaires, puis ajoutez le CSS personnalisé suivant dans la zone CSS personnalisé sur la gauche.
.bypostauthor { background-color: #e7f8fb; }
Vous remarquerez immédiatement le changement de commentaire de l’auteur correspondant au CSS personnalisé que vous avez entré.
Alors, comment est-ce que tout ça fonctionne?
Vous voyez que WordPress ajoute des classes CSS par défaut à différentes zones de votre site Web. Ces classes CSS sont là quel que soit le thème WordPress que vous utilisez.
Dans cet exemple de code, nous avons utilisé le .bypostauthor
Classe CSS qui est ajoutée à tous les commentaires ajoutés par un auteur de publication.
Ajoutons quelques styles CSS supplémentaires pour le rendre encore plus visible. Voici un exemple de code qui ajoute une petite étiquette « Auteur » aux commentaires de l’auteur du message et une bordure autour de l’image de l’avatar de l’auteur.
.bypostauthor:before { content:"Author"; float:right; background-color:#FF1100; padding:5px; font-size:small; font-weight:bold; color:#FFFFFF; } .bypostauthor .avatar { border:1px dotted #FF1100; }
Voici à quoi cela ressemblait sur notre site Web de test.
Mise en évidence des commentaires par rôle d’utilisateur dans WordPress
Maintenant, de nombreux blogs WordPress ont des membres d’équipe chargés de répondre aux commentaires. Les sites Web populaires peuvent avoir un auteur de publication, un administrateur et des modérateurs qui répondent tous aux commentaires pour stimuler l’engagement des utilisateurs.
Comment mettre en évidence un commentaire ajouté par un membre du personnel qui n’est pas le véritable auteur du message ?
Il existe un hack facile pour y parvenir. Cependant, cela vous oblige à ajouter un code personnalisé à votre site Web WordPress. Si vous ne l’avez pas encore fait, consultez notre article sur la façon d’ajouter facilement du code personnalisé dans WordPress.
Tout d’abord, vous devez ajouter le code suivant au plugin d’extraits de code ou au fichier functions.php de votre thème.
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 ajoute simplement l’étiquette du rôle d’utilisateur à côté du nom de l’auteur du commentaire. Voici à quoi cela ressemblerait sans aucun style personnalisé.
Rendons-le un peu plus joli en ajoutant du CSS personnalisé. Aller à Apparence » Personnaliser page et passez à l’onglet CSS supplémentaire.
Après cela, vous pouvez utiliser le CSS suivant pour styliser l’étiquette du rôle d’utilisateur dans les commentaires.
.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; }
Voici à quoi cela ressemblait sur notre site de test. N’hésitez pas à modifier le code pour qu’il corresponde aux couleurs et au style de votre thème.
Pour plus de détails, vous pouvez lire notre article sur la façon d’ajouter des étiquettes de rôle d’utilisateur aux commentaires WordPress.
Nous espérons que cet article vous a aidé à apprendre comment mettre en évidence les commentaires des auteurs dans WordPress. Vous voulez voir comment les utilisateurs interagissent avec votre site Web ? Consultez notre didacticiel sur la façon de suivre l’engagement des utilisateurs dans WordPress et d’ajouter une notification push Web sur votre site WordPress pour augmenter votre trafic.