Jak dodać etykietę roli użytkownika obok komentarzy w WordPress

Jeden z naszych czytelników zapytał niedawno, czy możliwe jest wyróżnienie ról użytkowników obok każdego komentarza w WordPress. To częste pytanie, a my pomogliśmy wielu właścicielom witryn internetowych dodać tę funkcję, aby zbudować silniejsze poczucie wspólnoty.

Wyświetlając etykietę roli użytkownika, możesz natychmiast zasygnalizować, które komentarze pochodzą od zaufanych użytkowników Twojej witryny internetowej, takich jak autorzy, redaktorzy i administratorzy.

W tym artykule pokażemy, jak łatwo dodać etykietę roli użytkownika obok komentarzy w WordPress.

Dlaczego warto wyświetlać etykietę roli użytkownika obok nazwy autora komentarza w WordPress?

Jeśli zezwalasz na rejestrację użytkowników w twojej witrynie internetowej lub prowadzisz witrynę WordPress z wieloma autorami, etykiety użytkowników mogą przedstawiać użytkowników sobie nawzajem na podstawie ich ról.

Na przykład użytkownicy z rolą redaktora będą wyświetlać plakietkę obok swojej nazwy w komentarzach, informując innych użytkowników, że ten komentarz został napisany przez redaktora.

Buduje to zaufanie wśród twoich odbiorców i zwiększa zaangażowanie użytkowników w komentarze na twojej witrynie internetowej.

Wiele motywów WordPress podświetla tylko komentarze autorów wpisów. Nie wyświetlają etykiet dla innych ról użytkowników, nawet jeśli inne komentarze są tworzone przez zarejestrowanych użytkowników lub administratorów witryny.

Biorąc to pod uwagę, przyjrzyjmy się, jak łatwo dodać etykietę roli użytkownika obok komentarzy w WordPress.

Dodawanie etykiety roli użytkownika obok nazwy autora komentarza w WordPress

Ten poradnik wymaga dodania kodu do plików twojego motywu WordPress. Jeśli nie robiłeś tego wcześniej, zapoznaj się z naszym przewodnikiem na temat kopiowania i wklejania fragmentów kodu w WordPress.

Pierwszą rzeczą, którą musisz zrobić, jest dodanie następującego kodu do pliku functions. php twojego motywu, we wtyczce specyficznej dla witryny lub we wtyczce fragmentów kodu.

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;

Powyższy kod funkcji łączy się z filtrami WordPressa używanymi do wyświetlania nazwy autora komentarza w celu dołączenia etykiety roli użytkownika.

Zalecamy dodanie tego kodu za pomocą WPCode, najlepszej wtyczki do fragmentów kodu dla WordPress. To najbezpieczniejszy i najłatwiejszy sposób na dodanie kodu bez edytowania pliku functions.php twojego motywu.

Aby rozpocząć, należy zainstalować i włączyć bezpłatną wtyczkę WPCode. Aby uzyskać szczegółowe instrukcje, zobacz ten poradnik, jak zainstalować wtyczkę WordPress.

Po włączeniu wtyczki przejdź do Code Snippets ” + Add Snippet z kokpitu WordPress. Stamtąd kliknij przycisk „Użyj fragmentu” pod opcją „Dodaj swój własny konfigurator (nowy fragment kodu)”.

Następnie dodaj tytuł twojego fragmentu kodu u góry strony. Może to być cokolwiek, co pomoże ci zapamiętać, do czego służy kod.

Następnie wklej powyższy kod w polu „Podgląd kodu” i wybierz „Fragment kodu PHP” jako rodzaj kodu z rozwijanej listy po prawej stronie.

Następnie wystarczy przełączyć przełącznik z „Nieaktywny” na „Aktywny” i kliknąć przycisk „Zapisz fragment kodu”.

Możesz teraz przejść na dowolny wpis z komentarzami, aby zobaczyć go w działaniu.

W komentarzach zarejestrowanych użytkowników obok nazwy autora komentarza wyświetlana będzie jego rola użytkownika. W przypadku komentarzy niezarejestrowanych użytkowników wyświetlana będzie tylko nazwa autora komentarza.

Teraz, gdy dodaliśmy rolę użytkownika, nadszedł czas, aby nadać jej styl i sprawić, by wyglądała czysto.

W naszym kodzie dodaliśmy klasę CSS dla każdej roli użytkownika, dzięki czemu możemy użyć tych klas CSS, aby dostosować każdy identyfikator użytkownika w inny sposób (np. użyć różnych kolorów itp.).

Poniższy przykład CSS może posłużyć jako punkt wyjścia:

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

Możesz dostosować CSS do swoich upodobań. Tak to wyglądało na naszej demonstracyjnej witrynie internetowej:

Aby uzyskać więcej informacji, zapoznaj się z naszym przewodnikiem na temat tego, jak łatwo dodać własny CSS do twojej witryny WordPress.

Mamy nadzieję, że ten artykuł pomógł ci dowiedzieć się, jak dodać etykietę roli użytkownika obok komentarzy w WordPress. Możesz również zapoznać się z naszym przewodnikiem na temat tego, jak leniwie wczytywać gravatary w komentarzach WordPress i naszymi eksperckimi typami najlepszych wtyczek do ulepszania komentarzy WordPress.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.