Jako blog WordPress skupiający się na budowaniu stron internetowych, czasami natrafiamy na czytelników, którzy chcą wkleić fragment kodu lub podzielić się nim w komentarzach.
WordPress nie posiada jednak żadnego wbudowanego podświetlania składni dla komentarzy, postów lub stron, co może być trudne zarówno dla komentującego, jak i innych czytelników próbujących zrozumieć kod.
Na szczęście znaleźliśmy łatwy sposób na rozwiązanie tego problemu. W tym artykule pokażemy, jak łatwo dodać podświetlanie składni w komentarzach WordPress.
Dlaczego i kiedy potrzebne jest podświetlanie składni w komentarzach WordPress?
Podświetlanie składni to sposób na poprawienie wyglądu kodu i ułatwienie jego zrozumienia. Dodaje kolory i numery linii do fragmentów kodu, czyniąc je bardziej czytelnymi. Oto przykład:
<html>
<head>
<title>My Awesome Website</title>
</head>
<body>
<h1>Welcome to My Homepage</h1>
</body>
</html>
Jeśli masz bloga WordPress o tworzeniu stron internetowych lub kodowaniu, włączanie podświetlania składni w komentarzach WordPress jest ważne. Dzięki temu czytelnicy mogą łatwo pisać kod w czytelny sposób.
Zachęci ich to do pozostawiania większej liczby komentarzy i dzielenia się własnymi fragmentami kodu. Nie tylko sprawia to, że komentarze są bardziej interesujące, ale także buduje poczucie zaangażowania społeczności.
Ponadto, jeśli twoi czytelnicy potrzebują pomocy, mogą łatwo wstawić kod w komentarzu w sposób, który jest atrakcyjny wizualnie i łatwy do zrozumienia dla innych komentujących.
Mając to na uwadze, zobaczmy, jak można dodać podświetlanie składni w formularzu komentarza na twojej witrynie internetowej WordPress.
Krok 1: Zainstaluj wtyczkę Syntax Highlighter Evolved
Najprostszym sposobem na dodanie podświetlania składni w WordPressie jest użycie wtyczki Syntax Highlighter Evolved. Jest ona bardzo łatwa w użyciu i umożliwia włączanie podświetlania składni we wpisach, na stronach i w komentarzach WordPress.
W WPBeginner używamy tej wtyczki do wstawienia i wyświetlania fragmentów kodu. Możesz przeczytać nasz artykuł o tym, dlaczego używamy Syntax Highlighter Evolved, aby uzyskać więcej szczegółów.
Najpierw należy zainstalować i włączyć wtyczkę Syntax Highlighter Evolved. Aby uzyskać więcej informacji, zobacz nasz przewodnik krok po kroku, jak zainstalować wtyczkę WordPress.
Po zakończeniu możesz teraz edytować post lub stronę i dodać kod za pomocą zakreślacza składni. Oto jak to wygląda w edytorze bloków:
Więcej na temat korzystania z wtyczki Syntax Highlighter Evolved dowiesz się z naszego artykułu na temat wyświetlania kodu w WordPressie.
Domyślnie Syntax Highlighter Evolved umożliwia odwiedzającym dodawanie kodu w komentarzach, ale kod ten musi być opakowany w krótkie kody.
Te krótkie kody mają nazwy wszystkich popularnych języków programowania i skryptów. Oznacza to, że komentujący musi po prostu zawinąć swój kod w nawiasy kwadratowe zawierające nazwę języka.
Na przykład, jeśli chciałbyś wpisać komentarz zawierający kod PHP, użyłbyś poniższego:
Hi everyone. I need help with this PHP code: [php]
<?PHP
private function get_time_tags() {
$time = get_the_time('d M, Y');
return $time;
}
?>
[/php]Podobnie, jeśli chcesz wpisać kod HTML jako komentarz, musisz zawinąć go w krótki kod HTML:
Hey there! Could anyone check this code snippet? [html]<a href="https://example.com">Demo website>/a>[/html]To, co sprawia, że jest to trudne, to fakt, że użytkownicy nie wiedzą, że mogą używać podświetlania składni z tymi krótkimi kodami. Musisz więc poinformować ich o tym za pomocą powiadomienia.
Krok 2: Dodanie powiadomienia o podświetlaniu składni w formularzu komentarza
Aby poinformować komentujących o funkcji podświetlania składni, należy dodać powiadomienie nad twoim formularzem komentarza, w następujący sposób:
Możesz to zrobić, dodając własny fragment kodu do twojej witryny WordPress.
Jeśli czytasz ten poradnik, ponieważ prowadzisz bloga o kodowaniu, to najprawdopodobniej czujesz się całkiem dobrze z kodowaniem.
Mimo to, nawet najbardziej zaawansowanym użytkownikom może być trudno śledzić wszystkie fragmenty kodu. Jeśli nie są one odpowiednio zarządzane, mogą wystąpić typowe błędy WordPressa lub całkowicie zepsuć twoją witrynę.
Dlatego zalecamy korzystanie z WPCode, aby wstawić niestandardowe fragmenty kodu. Jest to najłatwiejszy i najbezpieczniejszy sposób dodawania własnego kodu w WordPressie bez konieczności edytowania jakichkolwiek rdzennych plików WordPressa.
Uwaga: Chociaż dostępna jest darmowa wersja WPCode, zalecamy korzystanie z wersji Pro WPCode, ponieważ zapewnia ona dostęp do inteligentnej logiki warunkowej, dostęp do biblioteki fragmentów kodu w chmurze i nie tylko.
Pierwszą rzeczą, którą musisz zrobić, to zainstalować i włączyć wtyczkę WPCode. Aby uzyskać więcej informacji, zobacz nasz przewodnik krok po kroku, jak zainstalować wtyczkę WordPress.
Po aktywacji udaj się do Code Snippets „ + Add Snippet.
Tutaj zobaczysz wszystkie gotowe fragmenty kodu, które możesz dodać do swojej witryny internetowej WordPress.
Ponieważ chcemy dodać własny fragment kodu, najedź kursorem na „Add Your Custom Code (New Snippet)”, a następnie kliknij „+ Add Custom Snippet”.
Na początek wpisz tytuł własnego fragmentu kodu. Może to być cokolwiek, co pomoże zidentyfikować fragment kodu.
Następnie otwórz menu rozwijane „Rodzaj kodu” i wybierz „Fragment kodu PHP”.
Teraz wystarczy wkleić poniższy fragment kodu do edytora kodu:
function wpbeginner_comment_text_before($arg) {
// Add a custom notice to inform users about using shortcodes for syntax highlighting
$arg['comment_notes_before'] .= "<p class='comment-notice'>You can use shortcodes for syntax highlighting when adding code. For example, or </p>";
// Return the modified comment arguments
return $arg;
}
// Add the filter to apply the custom comment modification function
add_filter('comment_form_defaults', 'wpbeginner_comment_text_before');
Następnie otwórz menu rozwijane „Lokalizacja” i kliknij „Uruchom wszędzie”.
Następnie możesz przewinąć do góry ekranu i kliknąć przełącznik „Nieaktywne”, aby zmienił się na „Aktywne”.
Na koniec kliknij przycisk „Zapisz fragment kodu”, aby uruchomić fragment kodu.
Ten kod po prostu wyświetla powiadomienie nad polem komentarza w formularzu komentarza WordPress. Jednak nie zobaczysz tego tekstu, gdy jesteś zalogowany na swoje konto, więc będziesz musiał otworzyć nowe okno przeglądarki w trybie incognito lub wylogować się ze swojego konta.
Jeśli chcesz sprawdzić, czy krótki kod faktycznie działa, przejdź na twoją witrynę internetową w trybie incognito, skomentuj wpis na blogu i użyj krótkiego kodu. Gdy komentarz zostanie poddany moderacji i zatwierdzony, powinieneś zobaczyć coś takiego:
Dowiedz się więcej o sposobach na zwiększenie zaangażowania w komentarze
Dodanie możliwości podświetlania składni nie jest jedynym sposobem na zwiększenie zaangażowania komentujących, jeśli prowadzisz bloga o tworzeniu stron internetowych.
Kolejną wskazówką jest dodawanie polubień do twoich komentarzy. Dzięki temu twoi czytelnicy mogą łatwo wyrazić swoje opinie na temat konkretnych komentarzy. Może to wywołać dyskusje i podkreślić cenny wkład Twojej społeczności.
Możesz także powiadamiać użytkowników, gdy otrzymają odpowiedzi na swoje komentarze. Zapewnia to ich zaangażowanie w rozmowę i sprawia, że wracają po więcej.
Dodatkowo, możesz dodać własne pola do formularza komentarza. Możesz to zrobić, jeśli chcesz, aby czytelnicy podawali konkretne informacje wraz ze swoimi komentarzami, takie jak język programowania, którego używają lub wersja frameworka.
Oto inne wskazówki, które można wdrożyć, aby zwiększyć zaangażowanie w komentarze:
- Jak wyświetlić najczęściej komentowane wpisy w WordPressie?
- Jak funkcjonować lub ukrywać komentarze w WordPressie
- Jak przekierować uwagę twojego użytkownika za pomocą Comment Redirect
Mamy nadzieję, że ten artykuł pomógł Ci dodać podświetlanie składni w komentarzach WordPress. Zachęcamy również do zapoznania się z naszym przewodnikiem na temat dodawania filmów i nie tylko w komentarzach na WordPressie, a także do wybrania najlepszych wtyczek do komentowania na WordPressie.
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.
Jiří Vaněk
Thank you for demonstrating the possibility using a snippet. I already have quite a lot of plugins on the site that I need to run it and at the same time, since I have a technology blog, I wanted to allow users to highlight codes in comments. I use WP Code for other snippets that have an important role on the website, so the possibility to do this with a snippet is very useful. Thank you once again, I will save the snippet to my code library for other sites as well.
Yves
Last update 9 months ago. Non tested with last Wordpress version.
WPBeginner Support
For that not tested warning, we would recommend taking a look at our article below:
https://www.wpbeginner.com/opinion/should-you-install-plugins-not-tested-with-your-wordpress-version/
Administrator
Seth
Nice and very informative article. I just turned on update notifications. Good one guys.
WPBeginner Support
Glad our article was helpful
Administrator