Benutzerrollen-Label neben Kommentaren in WordPress hinzufügen

Einer unserer Leser fragte kürzlich, ob es möglich sei, Benutzerrollen neben jedem Kommentar in WordPress hervorzuheben. Dies ist eine häufige Frage, und sie ist sinnvoll, da Kommentare schnell schwer zu verfolgen sein können, insbesondere auf stark besuchten Blogs oder Community-Websites.

Die Anzeige eines Labels für die Benutzerrolle neben jedem Kommentar hilft Ihren Besuchern, sofort zu erkennen, welche Kommentare von vertrauenswürdigen Benutzern wie Autoren, Redakteuren oder Administratoren stammen. Es fügt Kontext hinzu, baut Glaubwürdigkeit auf und kann sogar zu aussagekräftigeren Interaktionen in Ihrer Community anregen.

Wir haben vielen Website-Besitzern geholfen, diese Funktion hinzuzufügen, und es ist eine einfache Möglichkeit, Ihren Kommentarbereich organisierter und professioneller zu gestalten.

In diesem Artikel zeigen wir Ihnen, wie Sie ganz einfach ein Label für die Benutzerrolle neben Kommentaren in WordPress hinzufügen können, damit Ihre Leser schnell erkennen können, wer beiträgt.

Warum die Benutzerrollen-Beschriftung neben dem Kommentarautornamen in WordPress anzeigen?

Wenn Sie die Benutzerregistrierung auf Ihrer Website zulassen oder eine WordPress-Website mit mehreren Autoren betreiben, dann können die Anzeige von Benutzerrollen-Labels den Besuchern helfen, schnell zu verstehen, wer kommentiert und welche Benutzerrolle sie haben.

Zum Beispiel kann ein Benutzer mit der Benutzerrolle Editor eine Auszeichnung neben seinem Namen in den Kommentaren haben, die anderen signalisiert, dass der Kommentar von einem Editor stammt.

Dies schafft nicht nur Vertrauen bei Ihrem Publikum, sondern fördert auch bedeutungsvollere Interaktionen und Engagement auf Ihrer Website.

Viele WordPress-Themes heben nur Kommentare des Beitragautors hervor. Sie zeigen keine Labels für andere Benutzerrollen an, auch wenn andere Kommentare von registrierten Benutzern, Administratoren oder Redakteuren stammen. Das Hinzufügen dieser Labels stellt sicher, dass alle wichtigen Mitwirkenden auf Ihrer Website leicht erkannt werden.

Jetzt, da Sie die Vorteile verstehen, schauen wir uns an, wie Sie ganz einfach ein Benutzerrollen-Label neben Kommentaren in WordPress hinzufügen können.

Benutzerrollen-Label neben dem Kommentarautornamen in WordPress hinzufügen

Dieses Tutorial erfordert, dass Sie Code zu Ihren WordPress-Theme-Dateien hinzufügen. Wenn Sie dies noch nie getan haben, werfen Sie einen Blick auf unsere Anleitung zum Kopieren und Einfügen von Code-Snippets in WordPress.

Das Erste, was Sie tun müssen, ist, den folgenden Code zu Ihrer Theme-Datei functions.php hinzuzufügen, in einem standortspezifischen Plugin oder in einem Code-Snippet-Plugin.

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;

Dieser obige Funktionscode hakt in WordPress-Filter ein, die verwendet werden, um den Namen des Kommentarautors anzuzeigen, um das Label der Benutzerrolle einzuschließen.

Bei WPBeginner empfehlen wir immer, diesen Code mit WPCode, dem besten Code-Snippet-Plugin für WordPress, hinzuzufügen.

Die Verwendung von WPCode ist sicherer und einfacher, als die Datei functions.php Ihres Themes direkt zu bearbeiten. Es verhindert Fehler, die Ihre Website beschädigen könnten, hält Ihre Anpassungen organisiert und stellt sicher, dass Ihre Änderungen bei einem Theme-Update nicht verloren gehen.

Um zu beginnen, müssen Sie das kostenlose WPCode-Plugin installieren und aktivieren. Detaillierte Anweisungen finden Sie in diesem Tutorial zur Installation eines WordPress-Plugins.

Sobald das Plugin aktiviert ist, navigieren Sie im WordPress-Dashboard zu Code Snippets » + Snippet hinzufügen.

Klicken Sie von dort aus unter der Option „Fügen Sie Ihren benutzerdefinierten Code hinzu (neuer Ausschnitt)“ auf die Schaltfläche „Benutzerdefinierten Ausschnitt hinzufügen“.

Als Nächstes müssen Sie aus der Liste der angezeigten Optionen 'PHP-Snippet' als Code-Typ auswählen.

Dies bringt Sie zur Seite Benutzerdefinierten Snippet erstellen.

Von hier aus müssen Sie einen Titel für Ihren Code-Snippet hinzufügen. Dies kann alles sein, was Ihnen hilft, sich daran zu erinnern, wofür der Code ist.

Fügen Sie dann den obigen Code in das Feld 'Code-Vorschau' ein.

Danach verschieben Sie einfach den Schalter von 'Inaktiv' auf 'Aktiv' oben auf der Seite.

Klicken Sie schließlich auf die Schaltfläche „Snippet speichern“.

Sie können jetzt jeden Beitrag mit Kommentaren besuchen, um ihn in Aktion zu sehen.

Kommentare von registrierten Benutzern zeigen ihre Benutzerrolle neben dem Namen des Kommentarautors an. Jeder Kommentar von nicht registrierten Benutzern zeigt nur den Namen des Kommentarautors an.

Jetzt, da wir die Benutzerrolle hinzugefügt haben, ist es an der Zeit, sie zu gestalten und sie sauber aussehen zu lassen.

In unserem Code haben wir eine CSS-Klasse für jede Benutzerrolle hinzugefügt, damit wir diese CSS-Klassen verwenden können, um jedes Benutzer-Badge unterschiedlich anzupassen (d. h. verschiedene Farben usw. zu verwenden).

Sie können die folgende Beispiel-CSS als Ausgangspunkt verwenden:

.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;
}

Sie können die CSS nach Belieben anpassen. So sah es auf unserer Demowebsite aus:

Weitere Details finden Sie in unserem Leitfaden zum einfachen Hinzufügen von benutzerdefiniertem CSS zu Ihrer WordPress-Website.

Wir hoffen, dieser Artikel hat Ihnen geholfen zu lernen, wie Sie Benutzerrollen-Labels neben Kommentaren in WordPress hinzufügen. Möglicherweise möchten Sie auch unseren Leitfaden zum verzögerten Laden von Gravataren in WordPress-Kommentaren und unsere Expertenauswahl der besten Plugins zur Verbesserung von WordPress-Kommentaren lesen.

Wenn Ihnen dieser Artikel gefallen hat, abonnieren Sie bitte unseren YouTube-Kanal für WordPress-Video-Tutorials. Sie finden uns auch auf Twitter und Facebook.