Wysiwyg CodeMagic: pohodlná úprava zdrojového HTML v editoru v Drupalu

Na většině webů s Drupalem, které vyvářím, je nezbytná přítomnost vizuálního editoru. Dávám přednost TinyMCE, mimo jiné proto, že pro něj existuje spousta doplňujících modulů. Naposledy mě zaujal Wysiwyg CodeMagic umožňující pohodlnou úpravu HTML přímo v editoru.

Reklama

Používáte na webech s redakčním systémem Drupal nějaký vizuální editor? Já jej mám nasazen prakticky na všech webech pro své klienty (s výjimkou www.melvil.cz kde je hojně využíván markdown a svého www.polzer.cz, kde používám markdown v kombinaci se značkovacím editorem markItUp!).

Na všech dalších webech s Drupalem používám kombinaci modulu Wysiwyg API a editoru TinyMCE. Toto řešení má oproti použití přímo modulu TinyMCE spoustu výhod. Je univerzálnější (lze použít více editorů na jednom webu), je více rozšiřitelné návaznými moduly a v neposlední řadě se pro něj dají docela snadno psát další pluginy, tedy tlačítka pro TinyMCE. Viz článek Drupal, Wysiwyg a tvorba tlačítka pro editor TinyMCE.

Jedním ze zajímavých doplňkových modulů pro kombinaci Wysiwyg + TinyMCE je modul Wysiwyg CodeMagic. Doplní totiž do editoru prostředek pro pohodlnou úpravu zdrojového HTML se zvýrazňováním syntaxe, možností formátování kódu a také automatické dokončování psaných značek.

Jak na instalaci editoru zdrojového HTML v Drupalu 7

Pro další předpokládám, že už máte zprovozněnu kombinaci modulu Wysiwyg a editoru TinyMCE. Nyní si stáhněte a zapněte modul Wysiwyg CodeMagic. Na domovské stránce tohoto modulu najdete odkaz pro stažení balíčku CodeMagic. Ten si pak v počítači rozbalte a jako složku codemagic jej nakopírujte na svůj web do umístění sites/all/libraries/tinymce/jscripts/tiny_mce/plugins.

Přejděte do nastavení Konfigurace > Vytváření obsahu > Wysiwyg profiles a rozklepněte si některý z připravených profilů editoru TinyMCE. Zapněte zde tlačítko CodeMagic a nastavení uložte.

Nyní stačí otevřít editaci nebo vytváření nějakého obsahu, pro který se vám zobrazuje editor. V jeho nástrojové liště byste měli zaznamenat přítomnost nového tlačítka HTML, po jehož stisku se vám objeví okno pro úpravu zdrojového kódu.

Tlačítko CodeMagic v editoru TinyMCE v Drupalu

Všimněte si, že při psaní se vám automaticky objeví nápověda s možností doplnění odpovídajících značek.

CodeMagic

Možností, jak docílit zvýrazňování syntaxe HTML kódu v prostředí TinyMCE v Drupalu je více. Toto řešení mi však připadá velice jednoduché a pokud po něčem podobném toužíte, vřele vám jej doporučuji.

Tagy: 

Reklama

Komentáře

Jak málo stačí ke štěstí. Takovou dobu se trápím editací kódu mimo web a ejhle, jaké pěkné udělátko na to v TinyMCE mají. Je to bezvadné, jen doplním, že ten pludin se musí strčit trochu hloubš a sice do /sites/all/libraries/tinymce/jscripts/tiny_mce/plugins/ - kopírovaná složka se musí přejmenovat na - codemaster.

Jejda, hlavně že jsem to kopíroval správně u sebe :-) V článku opraveno. Přejmenovat se to má na codemagic, ne na codemaster. Codemaster je knihovna, kterou CodeMagic používá na zvýraznění syntaxe.

Tvořím weby. Nabízím poradenství pro Drupal. Jsem na Twitteru.

...správně! Důležité je, společnou silou dojít k cíli :o)  - codemagic - je správná volba. S omluvou a především s poděkováním. M.

Přidat komentář