Wie man Kommentare von Autoren in WordPress hervorhebt

Möchten Sie die Kommentare des Autors in WordPress-Beiträgen auf Ihrer Website hervorheben?

Das Hervorheben der Kommentare des Autors in Ihrem WordPress-Blog kann Ihnen helfen, Engagement aufzubauen. Benutzer sind eher bereit, einen Kommentar zu hinterlassen, wenn sie sehen, dass der Autor aktiv an der Diskussion teilnimmt.

In diesem Artikel zeigen wir Ihnen, wie Sie ganz einfach die Kommentare des Autors in WordPress hervorheben können, um das Engagement zu steigern.

Warum Kommentare von Autoren in WordPress hervorheben?

Kommentare sind eine großartige Möglichkeit, das Engagement der Benutzer auf Ihrer Website zu steigern. Wenn Sie mehr Kommentare zu Ihren Artikeln erhalten möchten, dann können Sie dies fördern, indem Sie sich aktiv an den Diskussionen beteiligen.

Bei einem neuen WordPress-Blog können Sie Kommentare während der Kommentarmoderation einfach beantworten. Wenn Sie einen Blog mit mehreren Autoren betreiben, dann können Sie die Autoren dazu ermutigen, sich ebenfalls an der Diskussion zu beteiligen.

Die meisten WordPress-Themes unterscheiden jedoch nicht zwischen den Kommentaren und listen sie mit demselben Stil auf.

Ein Gelegenheitsleser scrollt möglicherweise durch die Kommentare und bemerkt nicht den zusätzlichen Inhalt, den der Autor in der Diskussion beigesteuert hat.

Die Hervorhebung von Autorenkommentaren schafft hier Abhilfe und sorgt dafür, dass die Kommentare des Autors hervorstechen und besser wahrgenommen werden.

Das ultimative Ziel hier ist es, neue Benutzer zu ermutigen, sich an den Kommentaren zu beteiligen und letztendlich Ihren Newsletter zu abonnieren oder Kunde zu werden.

In diesem Sinne, lassen Sie uns einen Blick darauf werfen, wie Sie Autorenkommentare in WordPress einfach hervorheben können.

Hervorhebung von Kommentarautoren in WordPress

Der einfachste Weg, Kommentare nach dem Autor des Beitrags hervorzuheben, ist das Hinzufügen von benutzerdefiniertem CSS zu Ihrem WordPress-Theme. Dies ermöglicht Ihnen, den benötigten Code einfach hinzuzufügen und eine Live-Vorschau zu sehen, wie er auf Ihrer Website aussehen würde, ohne ihn zu speichern.

Zuerst müssen Sie im WordPress-Adminbereich auf Darstellung “ Anpassen gehen. Dadurch wird die Oberfläche des WordPress-Theme-Anpassers gestartet. Sie werden eine Reihe von Optionen in einer Spalte auf der linken Seite und eine Live-Vorschau Ihrer Website sehen.

Von hier aus müssen Sie auf die Registerkarte „Zusätzliches CSS“ klicken. Dadurch wird ein Textbereich geöffnet, in dem Sie das benutzerdefinierte CSS hinzufügen können.

Sie möchten jedoch sehen, wie das benutzerdefinierte CSS aussehen wird, wenn es angewendet wird. Dazu müssen Sie zu einem Blogbeitrag navigieren, der Kommentare eines Beitragsautors enthält.

Scrollen Sie nach unten in den Kommentarbereich und fügen Sie dann das folgende benutzerdefinierte CSS in das Feld Benutzerdefiniertes CSS auf der linken Seite ein.

.bypostauthor { 
background-color: #e7f8fb;
}

Sie werden sofort feststellen, dass sich der Autorenkommentar entsprechend dem von Ihnen eingegebenen benutzerdefinierten CSS ändert.

<img title=“Kommentar des Autors hervorgehoben mit einer anderen Hintergrundfarbe“ src=“https://www.wordpressmonster.de/wp-content/uploads/2021/03/highlightauthorcsspreview.png“ alt=“Kommentar des Autors hervorgehoben mit einer anderen Hintergrundfarbe“ width=“550″ height=“234″ class=“alignnone size-full wp-image-91638″>

Und wie funktioniert das alles?

Sie sehen, WordPress fügt einige Standard-CSS-Klassen zu verschiedenen Bereichen Ihrer Website hinzu. Diese CSS-Klassen sind vorhanden, unabhängig davon, welches WordPress-Theme Sie verwenden.

In diesem Beispielcode haben wir die CSS-Klasse .bypostauthor verwendet, die zu allen Kommentaren hinzugefügt wird, die von einem Beitragsautor hinzugefügt werden.

Fügen wir noch ein paar weitere CSS-Stile hinzu, um sie noch prominenter zu machen. Hier ist ein Beispielcode, der den Kommentaren des Beitragsautors ein kleines „Autor“-Label und einen Rahmen um das Avatar-Bild des Autors hinzufügt.

.bypostauthor:before { 
content: "Autor";
float:right;
background-color:#FF1100;
padding:5px;
font-size:small;
font-weight:bold;
color:#FFFFFF;
}
.bypostauthor .avatar {
border:1px dotted #FF1100;
}

So sah es auf unserer Test-Website aus.

Kommentare nach Benutzerrolle in WordPress hervorheben

In vielen WordPress-Blogs gibt es Teammitglieder, die für die Beantwortung von Kommentaren verantwortlich sind. Beliebte Websites haben möglicherweise Beitragsautoren, Administratoren und Moderatoren, die alle auf Kommentare antworten, um das Engagement der Benutzer zu steigern.

Wie heben Sie einen Kommentar hervor, der von einem Teammitglied hinzugefügt wurde, das nicht der eigentliche Autor des Beitrags ist?

Es gibt einen einfachen Hack, um das zu erreichen. Allerdings müssen Sie dazu benutzerdefinierten Code zu Ihrer WordPress-Website hinzufügen. Wenn Sie dies noch nicht getan haben, dann lesen Sie unseren Artikel darüber, wie Sie ganz einfach benutzerdefinierten Code in WordPress hinzufügen können.

Zunächst müssen Sie den folgenden Code in das Code Snippets-Plugin oder in die Datei functions.php Ihres Themes einfügen.

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' ) );
}
 
// Kommentar-Autorenrolle holen 
function wpb_get_comment_author_role($author, $comment_id, $comment) { 
$authoremail = get_comment_author_email( $comment) 
// Prüfen, ob der Benutzer registriert ist
if (email_exists($authoremail)) {
$commet_user_role = get_user_by( 'email', $authoremail );
$comment_user_role = $commet_user_role->roles[0];
// HTML-Ausgabe, die neben dem Namen des Kommentarautors eingefügt wird
$this->comment_user_role = ' ' .  ucfirst($comment_user_role) . '

‚;
} else {
$this->comment_user_role = “;
}
return $author;
}

// Kommentarautor anzeigen
function wpb_comment_author_role($author) {
return $author .= $this->comment_user_role
}
}
new WPB_Comment_Author_Role_Label;
endif;

Dieser Code fügt einfach das Benutzerrollen-Label neben dem Namen des Kommentarautors ein. So würde es ohne ein benutzerdefiniertes Styling aussehen.

Lassen Sie es uns ein wenig hübscher machen, indem wir etwas benutzerdefiniertes CSS hinzufügen. Gehen Sie auf die Seite Darstellung “ Anpassen und wechseln Sie zur Registerkarte Zusätzliches CSS.

Danach können Sie das folgende CSS verwenden, um das Benutzerrollen-Label in den Kommentaren zu gestalten.

.kommentar-autor-label {
    padding: 5px;
    font-size: 14px;
    border-radius: 3px;
}
 
.comment-author-label-editor { 
background-color:#efefef;
}
.kommentar-autor-label-autor {
background-color:#faeeee;
}
 
.comment-author-label-contributor {
background-color:#f0faee   
}
.comment-author-label-subscriber {
background-color:#eef5fa   
}
 
.kommentar-autor-label-administrator { 
background-color:#fde9ff;
}

So sah es auf unserer Testseite aus. Sie können den Code gerne an die Farben und den Stil Ihres Themes anpassen.

Für weitere Details lesen Sie bitte unseren Artikel über das Hinzufügen von Benutzerrollen-Labels zu WordPress-Kommentaren.

Wir hoffen, dass dieser Artikel Ihnen geholfen hat, zu erfahren, wie Sie Autorenkommentare in WordPress hervorheben können.