Wygląd pola komentarzy
autor: Robert
16 listopada 2014
W pliku <code>functions.php</code> możemy także zdefiniować jak będą wyglądały odpowiedzi pod naszym wpisem oraz dodać przycisk odpowiedzi.
Funkcja ta zawiera kilka wbudowanych w WordPressa funkcji ale ich nazwy są intuicyjne, więc bez problemu zrozumiecie o co chodzi:)
Zaczniemy od kodu:
Otwieramy funkcję comments_feed_template_callback($comment, $args, $depth) { ... } wewnątrz niej pobieramy sobie zmienną globalną comment i zamykamy kod PHP gdyż chcemy umieścić kod HTML, zamykamy go za pomocą ?>. Nasze komentarze będą wyświetlane za pomocą Bootstrapowego elementu „media” bo został on do tego stworzony:). Zaczynamy zatem od otwarcia diva z klasą .media, wewnątrz otwieramy kolejny element czyli link z klasą .pull-left oraz pobierzemy sobie do tego linka adres WWW autora komentarza a pomocą kodu <?php get_comment_author_url(); ?>.
Nasz link będzie wyświetlał „awatar” użytkownika, który ustawiamy w panelu WP gdy owego użytkownika zakładamy (na daną chwilę wyłączyłem w przykładowej templatce wyświetlanie tego avatara). Do wyświetlenia obrazka służy kod <?php echo get_avatar( get_the_author_meta( 'user_email' ), $size = '96', $default = '', $alt = false ) ?>.
Jak wiemy element media może posiadać swój nagłówek. Otwieramy zatem div z klasą .media-body a w jego wnętrzu h5 z klasą .media-heading czyli nasz nagłówek. Wewnątrz umieścimy sobie link do profilu autora komentarza oraz wyświetlimy jego imię. Aby podlinkować imię autora w atrybucie href umieścimy kod <?php get_comment_author_url(); ?>, który wygeneruje nam na stronie linka. Natomiast w tekscie linku umieścimy kod <?php echo get_comment_author(); ?>, który wyświetli nam imię autora komentarza. Zamykamy link i otwieramy sobie znacznik <small> wewnątrz którego za pomocą kodu <?php comment_date(); ?> o <?php comment_time(); ?> wyświetlimy sobie datę i godzinę dodania komentarza. Na koniec zamykamy sobie znacznik h5.
Następną czynnością jest wyświetlenie treści komentarza. Dokonujemy tego za pomocą kodu <?php comment_text(); ?>.
Ostatnią czynnością jest wyświetlenie przycisku umożliwiającego odpowiedź na komentarz. w tym celu korzystamy z funkcji <?php comment_reply_link(array_merge($args, array( ... )));. Wewnątrz umieszczamy następujące dane:
reply_textTekst na przycisku odpowiedzidepthpodajemy mu tu zmienną$depthmax_depthtutaj WP pobierze sobie maksymalną ilość „zagnieżdzenia” komentarzy, którą można ustawić w panelu.
Zamykamy otwarte wcześniej divy (media-body i media) oraz, aby oddzielić sobie komentarze kreską wstawiamy znacznik hr.
Pamiętamy, że na początku zamknęliśmy znacznik PHP, teraz musimy go ponownie otworzyć by nasz plik functions.php działał.
Jeszcze jedna rzecz, którą dopiszemy do naszego wyglądu komentarzy to podmiana linku do odpowiedzi na przycisk. Korzystamy w tym przypadku z WordPressowego filtra, który podmieni wartość klasy linku z odpowiedzią.
Najpierw dodajemy nasz filtr za pomocą kodu add_filter('comment_reply_link', 'add_reply_link_class'); gdzie pierwszy parametr to klasa linka z odpowiedzią a drugi parametr to funkcja, którą chcemy uruchomić. Tworzymy zatem funkcję function add_reply_link_class($class) { ... }. W niej za pomocą str_replace podmieniamy wartość "class='comment-reply-link" na wartość "class='btn btn-default pull-right" no i zwracamy tą wartość.
