GeSHi – kolorowanie składni kodu – Joomla 1.5


16 października 2010 / Michał Kortas


Prowadząc stronę o tematyce webmasterskiej było oczywiste, że nadejdzie taki moment w którym będę chciał przedstawić użytkownikowi listing kodu/składni w jakimkolwiek języku, czy to xHTML, PHP lub CSS. Na początku postanowiłem ambitnie podejść do sprawy, pisząc swój własny, autorski skrypt, jednak głównie z powodu małej ilości wolnego czasu (czyt. brakiem chęci) poczynania te zakończyły się fiaskiem.

Po przeszukaniu kilku, kilkunastu for internetowych, oraz po zasięgnięciu informacji na kilku grupach dyskusyjnych doszedłem do wniosku, że w zupełności wystarczy mi gotowy system kolorowania składniGeSHi. Było to rozwiązanie idealne, ponieważ mój serwis oparty jest na CMS’ie Joomla!, do którego wbudowano już wspomniane „kolorki”. Kilka prostych czynności pozwoli je uaktywnić.

Jednak zanim rozpoczniemy jakiekolwiek działania, krótko o samym GeSHi. Zobaczmy co mówi nam o tym Wikipedia

GeSHi (Generic Syntax Highlighter) – biblioteka (klasa w PHP) umożliwiająca kolorowanie składni ponad 100 języków (skryptowych, programowania itp.), w tym tak popularnych jak PHP, CSS, C++, Java, JavaScript, XML, HTML, MySQL, Visual Basic, C#,ASP i wielu innych. 

Tak więc stoi przed nami dość potężne narzędzie, dzięki któremu nasze listingi nie będą już szare i niezauważalne w gąszczu zdań na naszej stronie. Zabierzmy się więc do pracy.

Jak wiemy, w Joomli, przy zapisie artykułów zostają usunięte niektóre znaczniki HTML, PHP, czy JS, a to wszystko ze względów bezpieczeństwa (niekontrolowane przejęcie strony). Tak więc na samym początku powinniśmy wyłączyć tę opcję dla konta Super Administratora. Wybieramy w menu: Artykuły >> Wszystkie artykuły, a następnie klikamy w ikonkę Preferencje. Zaznaczamy na liście wszystkich użytkowników (oprócz konta Super Administrator) i wybieramy: Czarna Lista
Kolejną czynnością jest włączenie dodatku GeSHi na naszej kopii Joomla!. Wybieramy: Rozszerzenia >> Dodatki i tam szukamy pozycję Content – Code Highlighter (GeSHi), a następnie włączamy ją. 
Na koniec powinniśmy ustawić dodatek Content – Code Hightlighter (GeSHi) powyżej Content – Email Cloaking

Aby wstawić pokolorowany kod, musimy umieścić go pomiędzy znacznikami:

<pre xml:lang=”atrybut„>kod</pre>

Dokonujemy tego w edytorze WYSIWYG po uaktywnieniu opcji Przełącz edytor (tak aby widoczny był kod xhtml).
W miejscu lang=”atrybut” wpisujemy odpowiednią składnię, w zależności od wybranego przez nas rodzaju kodu:

  • CSS – wpisz parametr z atrybutem: lang=”css”
  • Html – wpisz parametr z atrybutem: lang=”html4strict”
  • JavaScript ? wpisz parametr z atrybutem: lang=”javascript”
  • PHP – wpisz parametr z atrybutem: lang=”php”
  • SQL – wpisz parametr z atrybutem: lang=”sql”
  • XML – wpisz parametr z atrybutem: lang=”xml”
 
Lista wszystkich dostępnych języków znajduje się na oficjalnej stronie GeSHi.

Wykonane przez nas czynności pozwolą nam w pełni wykorzystać potencjał kolorowania składni w CMS Joomla!. Zapraszam do komentowania i oceniania artykułu. Czekam też na wasze wskazówki i opinie.


Dodaj komentarz

Twój adres e-mail nie zostanie opublikowany.