为什么要在WordPress评论作者名旁显示用户角色标签?
如果你允许用户在网站上注册或运行一个多作者的WordPress网站,那么用户角色标签可以帮助用户根据其角色互相认识。例如,拥有编辑用户角色的用户在评论旁边会显示一个标签,让其他用户知道此评论是由编辑发布的。这有助于增加用户信任,并提高网站评论的用户参与度。
许多WordPress主题只突出显示帖子作者的评论,而不会为其他注册用户或站点管理员的评论显示任何标签。接下来我们将介绍如何在WordPress评论旁轻松添加用户角色标签。
在WordPress评论作者名旁添加用户角色标签
本教程需要你将代码添加到你的WordPress主题文件中。如果你之前没有做过,请参阅我们的指南,了解如何在WordPress中复制和粘贴代码片段。
首先,将以下代码添加到主题的functions.php文件、特定网站的插件或代码片段插件中。
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' ) );
}
// 获取评论作者角色
function wpb_get_comment_author_role($author, $comment_id, $comment) {
$authoremail = get_comment_author_email( $comment);
// 检查用户是否已注册
if (email_exists($authoremail)) {
$comment_user_role = get_user_by( 'email', $authoremail );
$comment_user_role = $comment_user_role->roles[0];
// HTML输出,将其添加到评论作者姓名旁
$this->comment_user_role = '
';
} else {
$this->comment_user_role = '';
}
return $author;
}
// 显示评论作者
function wpb_comment_author_role($author) {
return $author .= $this->comment_user_role;
}
}
new WPB_Comment_Author_Role_Label;
endif;
上述代码将挂钩到WordPress的过滤器中,使用这些过滤器来显示带有用户角色标签的评论作者姓名。
我们推荐使用WPCode,这是一款用于WordPress的最佳代码片段插件。使用它可以无需修改主题的functions.php文件,安全且简单地添加代码。
首先,安装并激活WPCode插件。详细的安装说明请参阅我们的教程。激活后,从WordPress后台导航到Code Snippets » + Add Snippet。然后,在‘Add Your Custom Code (New Snippet)’选项下点击‘Use Snippet’按钮。
接下来,在页面顶部为你的代码片段添加一个标题,这有助于你记住代码的用途。然后,将上面的代码粘贴到‘Code Preview’框中,并从右侧下拉列表中选择‘PHP Snippet’作为代码类型。
之后,只需将开关从‘Inactive’移到‘Active’,并点击‘Save Snippet’按钮。
现在,你可以访问任何有评论的帖子来查看效果。由注册用户发布的评论将显示其用户角色标签,而非注册用户的评论只会显示评论作者姓名。
现在我们已经添加了用户角色,是时候对其进行样式设计使其更加美观了。我们的代码中已经为每个用户角色添加了CSS类,因此我们可以使用这些CSS类来分别自定义每个用户徽章(如使用不同颜色等)。你可以使用以下示例CSS作为起点:
.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;
}
根据你的喜好自由调整CSS。这是我们在演示网站上的效果:
有关更多详细信息,请参阅我们的指南,了解如何轻松地向WordPress网站添加自定义CSS。
希望这篇文章能帮助你学会如何在WordPress评论旁添加用户角色标签。你还可以浏览我们关于如何在WordPress评论中延迟加载Gravatars的指南,以及我们推荐的提高WordPress评论的最佳插件。
如果你喜欢这篇文章,请订阅我们的YouTube频道以获取WordPress视频教程。你也可以在Twitter和Facebook上找到我们。