How to Add an Admin Badge in Blogger Comments (Using Profile ID)

If you want to highlight specific users in your Blogger comments like marking the admin, moderators, top commenters or supporters—you can do it by checking their profile ID or profile URL and adding a badge dynamically.

Step 1 — The XML Logic

In your Blogger XML editor, find the comment loop (usually <b:loop values='data:post.comments' var='comment'>). You want to place the following logic near the data:comment.authorPhoto.thumbUrl so the name and badge appears next to their avatar.

<div class='user' expr:alt='data:comment.author' expr:data='data:comment.authorUrl'>
  <b:class cond='data:post.author.name == data:comment.author' name='auth'/>
  <data:comment.author/>
</div>

<b:if cond='data:post.author.name == data:comment.author'>
  <div class='adminBadge' expr:data='data:comment.authorUrl' title='This user is an admin'>
  </div>
<b:else/>
  <div class='userBadge' expr:data='data:comment.authorUrl' title='This user is a supporter'>
  </div>
</b:if>

In Blogger, each comment has useful data like:

• data:comment.author → commenter name
• data:comment.authorUrl → profile link (this is what we’ll use)

Step 2 — The CSS Styling

Next, we need to define how the badges look. Add this CSS to your template (usually before the ]]></b:skin> tag or within your <style> tags).

.adminBadge, .userBadge {
  display: inline-block;
  padding: 1px 6px;
  font-size: 10px;
  font-weight: bold;
  border-radius: 3px;
  margin-top: 4px;
  text-transform: uppercase;
  cursor: help;
}

/* Admin */
.adminBadge[data*="XXXXXXXXXXXXXXX"]::after {
  content: 'Admin';
  background-color: #ff4757;
  color: #ffffff;
}

/* Supporters */
.userBadge[data*="XXXXXXXXXXXXXXX"]::after {
  content: 'Admin';
  background-color: #2f3542;
  color: #ced4da;
}

/* Moderator */
.userBadge[data*="XXXXXXXXXXXXXXX"]::after {
  content: 'Moderator';
  background-color: #f87171;
  color: #fff;
}

/* Styling for the username when it's the admin */
.user.auth {
  color: #ff4757;
  font-weight: bold;
}

• "XXXXXXXXXXXXXXX": This is where you would paste the unique ID from your own Blogger profile URL.

• You can edit the badge CSS to your liking—adjust the colors, size, spacing, and styling to fit your theme.

Step 3 — Promoting Engagement

To encourage your readers to interact, you can add a small note at the end of your post or in your sidebar:

"The result of active participation is a custom badge next to your name! If you find these technical tutorials helpful, make sure to bookmark this site and drop a comment below. Frequent commenters may be upgraded to the Supporter status!"

Result

Now your comments will show:

• Admin badge for you
• Moderator badge for selected users
• Supporter badge for special members

Tips

• Always use exact profile URL
• You can add unlimited roles (Moderator, Helper, Verified, etc.)
• Keep badge styles small to avoid clutter

And that’s it! You now know how to add custom badges to Blogger comments using profile IDs. This is a great way to highlight admins, supporters, or trusted members and make your comment section more engaging.