Egoblog.cz - Petr Kobelka

Syntax highlight v textarea - zvýrazňovač kódu

Rád bych Vám představil jeden bezvadný nástroj pro zvýraznění prorgamovacího kódu v editovatelném poli.


Webdesign | Komentáře (0) | Shlédnuto 1699 × | Vloženo: 13. března 2013

Co jsem si vybral za syntax highlight?

V mém administračním systému jsem byl postaven před problém, že potřebuji zvýrazňovat syntaxi CSS a HTML souborů. Je to z toho důvodu, že potřebuji editovat HTML šablony a CSS soubory pro vykreslování FRONT ENDu webu. Po internetu je zvýrazňovačů (syntax highlight) hodně, ale jen pár jich dokáže zvýraznít aktuálně editovaný text. Nástroj, který jsem si vybral je codemirror.

Nejenže je tento nástroj velice jednoduché použít, ale i jeho práce je pro mě velmi jednoduchá a užitečná. Dokumentace je dobře napsaná a po internetu najdete mnoho příkladů.

Příklad použití

Mám nějakou textareu a do ní vložím např. HTML kód. Zde je trochu mišmaš, protože pro čisté HTML nahráváte zvýrazňovač pro XML (kdo ví, pochopí, kdo ne, ten se zeptá ;-)

Vše, co musím udělat je pouze to, abych připojil základní JS knihovny a základní CSS styly pro zvýrazňování:


Připojím doplněk knihovny, který má zvýraznění řešit

A nastavím konfiguraci pro pole pro zvýraznění

var code_html = CodeMirror.fromTextArea(document.getElementById('editor'), 
{
  mode: "xml", 
  tabMode: "indent", 
  lineWrapping: true, 
  lineNumbers: true
});

To je vše. Pokud máte správně nastaveny cesty, pak Vám editor bude fungovat. Uvidíte něco takového

preview-highlight

Petr Kobelka | Egoblog.cz | Tvorba www stránek - www.petrkobelka.cz

Petr Kobelka
Autor je zkušeným web developerem a programátorem s více než 10 letými zkušenostmi. Pracuje jako programátor pro známou Olomouckou společnost zabývající se tvorbou internetových a intranetových řešení. Spolu se zaměstnáním pracuje na volné noze a zabývá se tvorbou internetových stránek. Ve volném čase rád fotí, jezdí na kole, plave a cestuje.

Komentáře

E-mail je potřeba pouze pro vygenerování Gravataru!

Oups, žádné komentáře? Buďtě první !!!

Blog píše Petr Kobelka

Petr Kobelka - egoblog.cz

Žádám všechny, kteří mají zájem vkládat komentáře, aby se řídili pravidly NETikety. Komentáře, porušující tato pravidla můžou být bez varování smazány.