W artykule:
Czy chcesz dodać podświetlanie składni w komentarzach WordPress? Domyślnie WordPress nie zawiera żadnego podświetlania składni dla komentarzy, postów lub stron.
Jeśli masz artykuły o kodowaniu lub programowaniu na swojej stronie, Czasami użytkownicy mogą chcieć zostawić przykłady kodu w komentarzach.
W tym artykule pokażemy, jak łatwo dodać podświetlanie składni w komentarzach WordPress.
Dlaczego I Kiedy potrzebujesz podświetlania składni w komentarzach WordPress
WordPress nie pozwala po prostu wklejać fragmentów kodu do artykułów ze względów bezpieczeństwa.
Możesz pokazać kilka próbek kodu, dodając blok kodu w swoim poście lub stronach za pomocą edytora bloków.
Następnie możesz dodać fragment kodu w obszarze tekstowym bloku kodu.
Możesz teraz zapisać zmiany w swoim poście lub stronie i wyświetlić ich podgląd, aby zobaczyć kod w akcji.
W zależności od motywu WordPress będzie on zwykle wyświetlany w bardzo prostym bloku tekstu i bez podświetlania składni.
To nie wygląda dobrze i nie jest bardzo pomocne dla użytkowników.
Podświetlanie składni jest formatem stylizacji powszechnie używanym do wyświetlania kodu. Dodaje numery linii i kolory, aby podświetlić wzorce kodu, co ułatwia zrozumienie.
Oto przykład fragmentu kodu z podświetleniem składni. Zwróć uwagę na numery linii i kolory używane do podświetlania różnych elementów w kodzie:
< html> < head> < title>Moja zajebista strona < / title> < / head> < body> <H1>Witam na mojej stronie < /H1 > < / body> < / html>
Teraz, jeśli prowadzisz blog WordPress o kodowaniu lub programowaniu, potrzebujesz podświetlania składni, aby poprawnie wyświetlać kod w swoich artykułach.
Możesz również chcieć, aby Twoi użytkownicy mogli używać tego samego podświetlania składni w komentarzach, co sprawi, że komentarze będą bardziej interesujące i angażujące dla użytkowników.
Mając to na uwadze, przyjrzyjmy się, jak dodać podświetlanie składni w komentarzach, postach i stronach WordPress.
Dodawanie zakreślacza składni w WordPress
Najprostszym sposobem na dodanie podświetlania składni w WordPress jest użycie zakreślacza składni Evolved. Jest bardzo łatwy w użyciu i pozwala włączyć podświetlanie składni w postach, stronach i komentarzach WordPress.
Najpierw musisz zainstalować i aktywować wtyczkę Syntax Highlighter Evolved. Aby uzyskać więcej informacji, zobacz nasz przewodnik krok po kroku, jak zainstalować wtyczkę WordPress.
Po aktywacji musisz edytować post lub stronę, na której chcesz dodać kod. Na ekranie edycji postów kliknij ikonę ( + ), aby dodać nowy blok, a następnie wstaw blok „SyntaxHighlighter Code” do obszaru treści.
Zobaczysz teraz nowy blok kodu w edytorze postów, w którym możesz wprowadzić swój kod. Po dodaniu kodu musisz wybrać Ustawienia bloku z prawej kolumny.
W tym miejscu możesz wybrać język programowania dla kodu, pokazać lub ukryć numery linii, kliknąć łącza i nie tylko.
Po zakończeniu zapisz swój post lub stronę. Możesz teraz odwiedzić swoją stronę internetową, aby zobaczyć swój kod z podświetleniem składni.
To było łatwe, prawda?
Jednak komentarze WordPress nie mają obsługi edytora bloków. Zobaczmy, jak użytkownicy mogą korzystać z zakreślacza składni ewoluował z ich komentarzy.
Dodawanie podświetlania składni w komentarzach WordPress
Zakreślacz składni Evolved jest domyślnie włączony dla komentarzy WordPress. Jednak aby użyć go w komentarzach, kod musi być zawinięty wokół skrótów.
Wtyczka zawiera kilka skrótów nazwanych od wszystkich popularnych języków programowania i skryptów.
Po prostu zawiń kod w nawiasy kwadratowe z nazwą języka. Na przykład, jeśli zamierzasz dodać kod PHP, dodasz go w ten sposób:
[php]
<?php
private function get_time_tags () {
$time = get_the_time ('d M, Y');
return $time;
}
?>
[/php]
Podobnie, jeśli chcesz dodać kod HTML, zawiń go wokół skrótu HTML w ten sposób:
[html]
<a href="https://example.com" > strona Demo< / a>
Dodawanie noty podświetlania składni w formularzu komentarza
Chociaż jest to łatwe w użyciu podświetlanie składni za pomocą skrótów, problem polega na tym, że użytkownicy nie wiedzą, że mogą to zrobić.
Na szczęście istnieje szybki sposób, aby dać im znać, że mogą używać podświetlania składni za pomocą skrótów.
W tym celu musisz dodać niestandardowy fragment kodu do swojej witryny WordPress. Jeśli nie robiłeś tego wcześniej, zapoznaj się z naszym przewodnikiem, jak dodać niestandardowy kod w WordPress.
Będziesz musiał dodać następujący kod do wtyczki urywki kodu, funkcje.plik php lub wtyczka specyficzna dla witryny.
function wpbeginner_comment_text_before ($arg) {
$arg['comment_notes_before'] .= "<p class = 'comment-notice' >możesz używać skrótów do podświetlania składni podczas dodawania kodu. Na przykład [php] [/php] lub [html] [/html]< / P>";
return $arg;
}
add_filter ('comment_form_defaults', 'wpbeginner_comment_text_before');
Ten kod po prostu wyświetla powiadomienie tuż przed polem komentarza w formularzu komentarza WordPress. Nie wyświetla jednak komunikatu dla zalogowanych użytkowników.
Możesz teraz otworzyć nowe okno przeglądarki w trybie incognito lub po prostu wylogować się z obszaru administracyjnego WordPress. Następnie możesz odwiedzić dowolny post na swoim blogu, aby zobaczyć powiadomienie o podświetlaniu składni w akcji.
Możesz również dodać niestandardowy CSS do stylizacji tego tekstu. Użyliśmy następującego niestandardowego kodu CSS na naszej stronie demonstracyjnej, możesz użyć tego jako punktu wyjścia.
p. comment-notice {
font-size: 14px;
kolor: #555;
line-height: 1.5;
}
Mamy nadzieję, że ten artykuł pomógł Ci dodać podświetlanie składni w komentarzach WordPress. Możesz również zobaczyć nasz przewodnik, w jaki sposób umożliwić użytkownikom przesyłanie zdjęć w komentarzach WordPress i kilka przydatnych wskazówek dotyczących stylu formularza komentarza WordPress.
Jeśli podoba Ci się ten artykuł, zasubskrybuj nasz kanał YouTube dla samouczków wideo WordPress. Znajdziesz nas również na Twitterze i Facebooku.
