Hur man markerar författarens kommentarer i WordPress

Din kommentarssektion är där din community kommer till liv. Det är ett viktigt utrymme för anslutning, konversation och läsare engagemang.

Som författare är dina svar en nyckel del av den interaktionen. Du vill se till att din röst är lätt för läsarna att hitta för att uppmuntra ännu mer diskussion.

Att markera dina kommentarer ger dem den uppmärksamhet de förtjänar. Denna enkla touch gör hela ditt diskussionsområde mer professionellt, organiserat och engagerande.

Vi tror att små designval kan ha stor inverkan på användarupplevelsen. Och detta är en av de enklaste och mest effektiva ändringarna du kan göra.

I den här artikeln visar vi dig hur du enkelt markerar författarens kommentarer i WordPress.

Varför markera författarens kommentarer i WordPress?

Kommentarer är ett utmärkt sätt att bygga användarengagemang på din webbplats. Om du vill få fler kommentarer på dina artiklar, kan du uppmuntra det genom att aktivt delta i diskussionerna.

För en ny WordPress-blogg kan du enkelt svara på kommentarer och delta i diskussioner med dina läsare. Om du driver en blogg med flera författare, kan du uppmuntra författare att också hjälpa till med moderering av kommentarer.

De flesta WordPress-teman skiljer dock inte mellan kommentarer, och de listas med samma stil.

En tillfällig läsare kan skrolla igenom kommentarerna och inte inse det ytterligare innehållet som bidragits av författaren i diskussionen.

Att markera författarens kommentarer hjälper dig att åtgärda det och gör att författarens kommentarer sticker ut och blir mer märkbara.

Det yttersta målet här är att uppmuntra nya användare att delta i kommentarerna och i slutändan prenumerera på ditt nyhetsbrev eller bli kund.

Med det sagt, låt oss titta på hur man enkelt markerar författarkommentarer i WordPress.

• Framhäv kommentar författare i WordPress
• Markera kommentarer efter användarroll i WordPress

Framhäv kommentar författare i WordPress

Det enklaste sättet att markera kommentarer från inläggsförfattaren är genom att lägga till anpassad CSS i ditt WordPress-tema. Detta gör att du enkelt kan lägga till den nödvändiga koden och se en liveförhandsgranskning av hur den skulle se ut på din webbplats utan att spara den.

Först måste du besöka Utseende » Anpassa i WordPress adminområde. Detta startar gränssnittet för WordPress temaanpassning. Du kommer att märka en mängd alternativ i en kolumn till vänster och en liveförhandsgranskning av din webbplats.

Härifrån behöver du klicka på fliken 'Ytterligare CSS'.

Detta öppnar ett textområde där du kommer att lägga till den anpassade CSS:en.

Du vill dock se hur den anpassade CSS:en kommer att se ut när den tillämpas.

För att göra det behöver du navigera till ett blogginlägg som innehåller kommentarer från en inläggsförfattare.

Bläddra ner till kommentarssektionen och lägg sedan till följande anpassade CSS i rutan för anpassad CSS till vänster.

.bypostauthor { 
background-color: #e7f8fb;
}

Du kommer omedelbart att märka att författarens kommentar ändras och matchar den anpassade CSS du angav.

Så hur fungerar allt detta?

Som du ser lägger WordPress till några standard CSS-klasser till olika delar av din webbplats. Dessa CSS-klasser finns där oavsett vilket WordPress-tema du använder.

I det här exempelkoden har vi använt CSS-klassen .bypostauthor, som läggs till alla kommentarer som lagts till av en inläggsförfattare.

Låt oss lägga till lite mer CSS-stilar för att göra den ännu mer framträdande. Här är ett exempel på kod som lägger till en liten "Författare"-etikett till kommentarer från inläggsförfattaren och en kant runt författarens avatarbild.

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

Så här såg det ut på vår testwebbplats.

Markera kommentarer efter användarroll i WordPress

Nu har många WordPress-bloggar teammedlemmar som ansvarar för att svara på kommentarer. Populära webbplatser kan ha inläggsförfattare, administratörer och moderatorer som alla svarar på kommentarer för att öka användarnas engagemang.

Hur markerar du en kommentar som lagts till av en personalmedlem som inte är den faktiska författaren till inlägget?

Det finns en enkel lösning för att uppnå det. Det kräver dock att du lägger till anpassad kod på din WordPress-webbplats. Om du inte har gjort det tidigare, se vår artikel om hur man klistrar in kodavsnitt från webben i WordPress.

Först måste du lägga till följande kod i ditt temas functions.php-fil eller i ett kodavsnittstillägg:

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;

Istället för att redigera din temas functions.php-fil rekommenderar vi att du lägger till den här koden med WPCode.

Detta plugin för kodavsnitt gör det säkert och enkelt att lägga till anpassad kod i WordPress.

För att komma igång måste du installera och aktivera det kostnadsfria WPCode-pluginet. Om du behöver hjälp, se vår guide om hur man installerar ett WordPress-plugin.

När pluginet är aktiverat, gå till Kodavsnitt » Lägg till kodavsnitt från din WordPress-instrumentpanel.

Håll sedan muspekaren över alternativet 'Lägg till din anpassade kod (nytt kodavsnitt)' och klicka på knappen 'Lägg till anpassat kodavsnitt'.

Välj sedan 'PHP-avsnitt' som kodtyp från de alternativ som visas på skärmen.

Nu kan du lägga till en titel för ditt utdrag och klistra in koden ovan i rutan 'Kodförhandsgranskning'.

Därefter växlar du helt enkelt omkopplaren från 'Inaktiv' till 'Aktiv' och klickar på knappen 'Spara kodavsnitt' högst upp på sidan.

Denna kod lägger helt enkelt till användarrollens etikett bredvid kommentarsförfattarens namn. Så här skulle det se ut utan någon anpassad stil.

Låt oss göra det lite snyggare genom att lägga till lite anpassad CSS. Gå till sidan Utseende » Anpassa och byt till fliken Ytterligare CSS.

Du kan använda följande CSS för att styla användarrollens etikett i kommentarerna.

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

Så här såg det ut på vår testsida. Ändra gärna koden för att matcha ditt temas färger och stil.

För mer information kan du läsa vår artikel om hur du lägger till användarrollens etiketter till WordPress-kommentarer.

Vi hoppas att den här artikeln hjälpte dig att lära dig hur du markerar författarkommentarer i WordPress. Du kanske också vill se vår handledning om hur du markerar nya inlägg för återkommande besökare i WordPress och våra experters val av bästa författarbiografipluggar för WordPress.

Om du gillade den här artikeln, prenumerera då på vår YouTube-kanal för WordPress-videoguider. Du kan också hitta oss på Twitter och Facebook.