How To Add a User Role Label Next to Comments in WordPress

How To Add a User Role Label Next to Comments in WordPress

Similar to other Content Management Systems, WordPress comes with preset User Roles. Nevertheless, you can as well create custom-made user roles.

Blog post comments help website owners and administrators to communicate with their website users in an extraordinary manner. Attaching User role label to comments made by registered website users like authors, editors, and website administrators give credence to and improve the quality of the comments and make them look more credible.

Identifying the comments of the website owners or members of an editorial team helps website visitors to identify official responses from the website owners.

This makes it easy to know comments coming from officials of the website from those of other users.

This article discusses step by step tips you can follow to attach user role label to WordPress comments.

The advantage of User Role Label Next to Comment Author Name in WordPress

Affixing user role to comment is particularly important when you enable user registration or when you give multiple authors access to your WordPress website. In this case, user labels serve as some kind of introduction to each one of the users by describes the roles assigned to them.

If a comment is coming from the site’s editor for instance, a label close to his or her name will show website visitors that the comment is coming from the website editor.

User roles next to comments, also increase user trust and make them willing to engage more with the website through their comments.

Some WordPress themes only emphasize comments that come from the author of the article and not comments from other registered users including the website owners or administrators.

However, the preset user roles that commonly come with WordPress themes include the following:

Admin User Role

This role is assigned to any website user that has access to the whole website. This user can access network administrative features and make alterations to all the articles on the website.

Administrator User Role

This role is assigned to a website user with a profile containing all administration features.

Editor User Role

This

role is assigned to a user with the power to

write, edit and publish posts which could be his or hers or those of other authors.

Author User Role

This role is assigned to a user with the capacity to write, edit and publish only their contents and not those of others.

Contributor User Role

This role is assigned to a user who can create content and edit it but is unable to publish the post, himself or herself on the main site.

Subscriber User Role

This role is assigned to a website user who can only take care or his or her profile but incapable of performing any additional function.

Before we explain how you can add user role in WordPress comment, there a few terms you need to understand. These are hooks, action and filters.

Implementing Hooks

Hooks are the foremost requirement of the WordPress website theme and web development. They are functions implemented in WordPress.

Implementing The WordPress Actions and Filters

The WordPress Actions and Filters are two functions in WordPress that can readily be customized by the designers of themes and plugins of WordPress. Thus, altering a default function setting in WordPress Website changes its functionality.

It is essential to mention that actions and filters differ from each other and means a different thing in WordPress. Actions are functions executed when a specific task is performed in WordPress.

Filters, on the other hand, permit you to alter specific WordPress functions. The cases for hooking filters and actions are very much related to each other. However, they differ in their manner of operation or in their functionality.

The following illustrates an implementation of a Hook in conjunction with a Filter in WordPress:

function wpb_custom_excerpt( $output )
{
if ( has_excerpt() && ! is_attachment() )
{
$output .= wpb_continue_reading_link();
}
return $output;
}
add_filter( 'get_the_excerpt', 'wpb_custom_excerpt' );

The code above, thus generated a function “wpb_custom_excerpt” which is hooked with the get_the_excerpt Filter in WordPress.

The code below illustrates a Hook utilized with an Action:

function mytheme_enqueue_script()
{
wp_enqueue_script( 'my-custom-js', 'custom.js', false );
}
add_action( 'wp_enqueue_scripts', 'mytheme_enqueue_script' );

This yield a code which is very much related to the first code and generate a function “mytheme_enqueue_script” which is hooked into “wp_enqueue_scripts Action” in WordPress.

How To add User Role Label Next To Comment In WordPress

Step 1: Add Code To Your WordPress Theme Files.

When you are done, the next thing you ought to do is to incorporate the code below on your theme’s functions.php file. Alternatively, you can incorporate the code into a special plugin on the website.

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);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;

What occurred is that the above function code hooked into WordPress filters. It helps to display a tag or label close to an auto comment. And this implies we have incorporated the user role next to it.

Step 2: Check It Out

When you have done this, you can test it out by checking if any post with a user’s comment displays the role of the user close to it. Normally, after implementing the codes, any comment left by the website’s registered user’s displays user role.

However, if a comment comes from a website user who is not registered, no role is assigned to such a user. See an example in the screenshot below:

Step 3: Add Style To Your User Role

After creating a user role, the next thing you can do is to give the user role label a better style to make it look more appealing to the eye. You need to, first of all, add the codes.

After that, assign a CSS class for each user role. These CSS classes help you to modify user labels in different ways with the use of various formatting options like giving a different color to the user label created.

Thus, you can use the sample CSS presented below to start your code:

.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
{

Step 4: Customize The CSS

What you can do at this point is to modify the CSS the way you like. The changes you make can look like the screenshot below:

Conclusion

This is all there is to it. If you followed the steps up to this point, you can now comfortably add User Role Label to Comments in WordPress website.

Do not fail to give us a shout if you get stuck while following the tips. We’ll be more than happy to help but these steps are easy to implement even with just basic coding language.

Check out these top 3 WordPress hosting services:

HostArmada
$2.49 /mo
Starting price
Visit HostArmada
Rating based on expert review
  • User Friendly
    4.5
  • Support
    4.5
  • Features
    4.5
  • Reliability
    4.5
  • Pricing
    4.0
Hostinger
$2.99 /mo
Starting price
Visit Hostinger
Rating based on expert review
  • User Friendly
    4.7
  • Support
    4.7
  • Features
    4.8
  • Reliability
    4.8
  • Pricing
    4.7
FastComet
$1.79 /mo
Starting price
Visit FastComet
Rating based on expert review
  • User Friendly
    4.7
  • Support
    5.0
  • Features
    4.8
  • Reliability
    4.5
  • Pricing
    5.0
HostAdvice.com provides professional web hosting reviews fully independent of any other entity. Our reviews are unbiased, honest, and apply the same evaluation standards to all those reviewed. While monetary compensation is received from a few of the companies listed on this site, compensation of services and products have no influence on the direction or conclusions of our reviews. Nor does the compensation influence our rankings for certain host companies. This compensation covers account purchasing costs, testing costs and royalties paid to reviewers.
Click to go to the top of the page
Go To Top