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. Jest to częste pytanie i ma sens, ponieważ komentarze mogą szybko stać się trudne do śledzenia, zwłaszcza na ruchliwych blogach lub stronach społecznościowych.

Wyświetlanie etykiety roli użytkownika obok każdego komentarza pomaga odwiedzającym natychmiast zobaczyć, które komentarze pochodzą od zaufanych użytkowników, takich jak autorzy, redaktorzy lub administratorzy. Dodaje to kontekstu, buduje wiarygodność, a nawet może zachęcić do bardziej znaczących interakcji w Twojej społeczności.

Pomogliśmy wielu właścicielom stron dodać tę funkcję, i jest to prosty sposób na uczynienie sekcji komentarzy bardziej zorganizowaną i profesjonalną.

W tym artykule pokażemy Ci, jak łatwo dodać etykietę roli użytkownika obok komentarzy w WordPress, dzięki czemu Twoi czytelnicy będą mogli szybko rozpoznać, kto dodaje treści.

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

Jeśli zezwalasz na rejestrację użytkowników na swojej stronie internetowej lub prowadzisz wieloautorski blog w WordPress, wyświetlanie etykiet ról użytkowników może pomóc odwiedzającym szybko zrozumieć, kto komentuje i jaka jest jego rola użytkownika.

Na przykład użytkownik z rolą użytkownika edytora może mieć odznakę obok swojego imienia w komentarzach, sygnalizując innym, że komentarz pochodzi od edytora.

To nie tylko buduje zaufanie wśród odbiorców, ale także zachęca do bardziej znaczących interakcji i zaangażowania na Twojej stronie.

Wiele motywów WordPress wyróżnia tylko komentarze autora posta. Nie wyświetlają etykiet dla żadnych innych ról użytkowników, nawet jeśli inne komentarze są dodawane przez zarejestrowanych użytkowników, administratorów lub redaktorów. Dodanie tych etykiet zapewnia łatwe rozpoznawanie wszystkich kluczowych współtwórców na Twojej stronie.

Teraz, gdy rozumiesz korzyści, 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 samouczek wymaga dodania kodu do plików motywu WordPress. Jeśli nigdy tego nie robiłeś, zapoznaj się z naszym przewodnikiem, jak kopiować i wklejać fragmenty kodu w WordPressie.

Pierwszą rzeczą, którą musisz zrobić, jest dodanie poniższego kodu do pliku functions.php swojego motywu, w wtyczce specyficznej dla witryny lub w 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 hakuje do filtrów WordPress używanych do wyświetlania nazw autorów komentarzy, aby uwzględnić etykietę roli użytkownika.

W WPBeginner zawsze zalecamy dodawanie tego kodu za pomocą WPCode, najlepszej wtyczki fragmentów kodu dla WordPress.

Korzystanie z WPCode jest bezpieczniejsze i łatwiejsze niż bezpośrednia edycja pliku functions.php Twojego motywu. Zapobiega błędom, które mogłyby zepsuć Twoją witrynę, utrzymuje Twoje niestandardowe rozwiązania w porządku i zapewnia, że Twoje zmiany nie zostaną utracone podczas aktualizacji motywu.

Aby rozpocząć, musisz zainstalować i aktywować darmową wtyczkę WPCode. Szczegółowe instrukcje znajdziesz w tym poradniku jak zainstalować wtyczkę WordPress.

Po aktywacji wtyczki przejdź do Fragmenty kodu » + Dodaj fragment z panelu administracyjnego WordPress.

Stamtąd kliknij przycisk „+ Dodaj niestandardowy fragment” w opcji „Dodaj własny kod (nowy fragment)”.

Następnie musisz wybrać „Fragment PHP” jako typ kodu z listy opcji, które pojawią się na ekranie.

Spowoduje to przejście do strony Tworzenie niestandardowego fragmentu kodu.

Tutaj musisz dodać tytuł dla swojego fragmentu kodu. Może to być cokolwiek, co pomoże Ci zapamiętać, do czego służy ten kod.

Następnie wklej powyższy kod do pola „Podgląd kodu”.

Następnie po prostu przesuń przełącznik z pozycji „Nieaktywny” na „Aktywny” u góry strony.

Na koniec kliknij przycisk „Zapisz fragment”.

Możesz teraz odwiedzić dowolny wpis z komentarzami, aby zobaczyć to w akcji.

Komentarze zarejestrowanych użytkowników będą wyświetlać ich rolę użytkownika obok nazwy autora komentarza. Każdy komentarz od niezarejestrowanych użytkowników będzie wyświetlał tylko nazwę autora komentarza.

Teraz, gdy dodaliśmy rolę użytkownika, czas ją ostylować i nadać jej schludny wygląd.

W naszym kodzie dodaliśmy klasę CSS dla każdej roli użytkownika, dzięki czemu możemy używać tych klas CSS do różnego dostosowywania odznak użytkowników (np. używać różnych kolorów itp.)

Możesz użyć poniższego przykładowego CSS jako punktu 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;
}

Zachęcamy do dostosowania CSS do własnych potrzeb. Tak to wyglądało na naszej stronie demonstracyjnej:

Więcej szczegółów znajdziesz w naszym przewodniku jak łatwo dodać niestandardowy CSS do swojej 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 jak leniwie ładować Gravatary w komentarzach WordPress oraz naszymi ekskluzywnymi wyborami najlepszych wtyczek do ulepszania komentarzy w WordPress.

Jeśli podobał Ci się ten artykuł, zasubskrybuj nasz kanał YouTube po samouczki wideo WordPress. Możesz nas również znaleźć na Twitterze i Facebooku.