如何在WordPress评论旁添加用户角色标签

WPressize Me

09/05/2022

为什么要在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 = ' ' . ucfirst($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上找到我们。



Related Posts

  • 2025-02-16
  • WordPress 教学

你是否想过,能不能用更引人注目的方式取代WooCommerce中基本的促销徽章?答案是肯定的!通过自定义产品徽章,你可以在在线商店中突出新产品、折扣商品或限时优惠。在这篇文章中,我们将展示给你两个简单的方法,使用强大的插件或添加简单代码来为你的WooCommerce商店添加自定义产品徽章。

閱讀更多
  • 2025-01-18
  • WordPress 教学

我们都知道推荐计划是强大的武器。但要找到真正的品牌代言者并不容易。许多计划吸引的只是想快速赚钱的人,导致非真实的推广,无法有效转化客户。幸好,作为 WooCommerce 商店的店主,您有一个巨大的优势:一群真正喜爱和使用您产品的内置客户群。通过将这些现有客户转化为推广合伙人,您可以释放真实口碑营销的力量。

閱讀更多
  • 2025-01-10
  • WordPress 教学

最近,我们的一位比利时读者在其在线商店中苦于销售增长缓慢。除了其他建议外,我们建议他们在网站上设置Bancontact支付。Bancontact是一种主要在比利时使用的流行支付系统,客户可以通过银行账户进行安全的实时支付。

閱讀更多

{"email":"Email address invalid","url":"Website address invalid","required":"Required field missing"}
>