Hướng dẫn thêm User Role Label cạnh tên người comment trong WordPress

Them user role label ben canh ten binh luan tren WordPress

User Role Label cạnh tên người comment trong WordPress

Tiếp tục với trò đổi tên thì trong bài này, Hocban.vn chia sẻ đến bạn cách để: thêm User Role Label cạnh tên người comment (bình luận) trong WordPress.

Hướng dẫn cách thêm User Role Label cạnh tên người comment trong WordPress

Sẽ rất nhanh thôi, nó bao gồm 3 bước dưới đây, bạn thực hiện cẩn thận nhé vì nó là chèn code vào theme.

  • Bước 1: Bạn copy và dán đoạn code sau vào dưới cùng của file function.php của theme đang dùng.
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;
  • Bước 2: Vào Customize >> Additional CSS >> dán đoạn CSS dưới đây vào trong đó rồi lưu lại để xem kết quả.
.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;
}

Rất nhanh và đơn giản đúng không nào ? Tuy nhiên mình nhắc lại là với những thao tác chèn code trực tiếp vào theme thì bạn phải cẩn thận, làm từ từ nếu không rành, kẻo lại hỏng theme, hỏng web thì khổ.

Rồi, bây giờ đến đoạn giao lưu, anh em nào có xài qua thủ thuật này mời comment bên dưới để giao lưu học hỏi thêm về mẹo này nhé, cảm ơn anh em !

Bài viết liên quan

Nếu bạn thấy bài viết này hữu ích thì có thể chia sẻ nó qua:

Bài viết bạn đang xem được viết bởi Tịnh Nguyễn, là người thường đăng bài và comment dạo trên Hocban.vn

Bài viết có vẻ liên quan ^ ^
avatar
3 Comment threads
3 Thread replies
0 Followers
 
Most reacted comment
Hottest comment thread
4 Comment authors
văn phòng phẩm vinacomHocban.vnNam HảiMinh Khanh Recent comment authors
văn phòng phẩm vinacom <span style="color: #e91e63;">(</span><span class="wpdiscuz-comment-count">3</span><span style="color: #e91e63;">) </span>

Tiếc quá, mình sử dụng facebook comment nên không dùng cái này được rồi. Share cho bạn nào dùng comment wordpress

Nam Hải <span style="color: #e91e63;">(</span><span class="wpdiscuz-comment-count">13</span><span style="color: #e91e63;">) </span>

hay quá, đây cũng là 1 kiến thúc mà mình nên học, cảm ơn bạn đã Hướng dẫn thêm User Role Label chi tiết đến như vậy

Minh Khanh <span style="color: #e91e63;">(</span><span class="wpdiscuz-comment-count">29</span><span style="color: #e91e63;">) </span>

test xem người dùng có huy hiệu ko?