On-line wysiwyg editor: Tiny MCE

(článek ze dne 06. 07. 2011)

Tak jako u všech komponent, které využívám od třetích stran, podrobil jsem i wysiwyg editory náležitému zkoumání.

Je váš web je zastaralý? Nezobrazuje se korektně v mobilu? Dost možná je čas na změnu.
Kompletní analýza SEO a přístupnosti, programování webů na platformě ProcessWire.
Zeptejte se, jak co nejefektivněji situaci napravit a držet krok s vývojem webových technologií.

Ze všech mnoha a mnoha dostupných jsem nakonec zvolil sice robustní, ale spolehlivý Tiny MCE.

Daň, kterou je třeba vždy u dotažených řešení zaplatit je, že je třeba se prokousat i mnohačetnými možnostmi nastavení.

Pokud Vás například štve, že v defaultním nastavení překládá editor všechny české znaky na html entity a zdrojový kód je tak těžko okem čitelný, zabráníte tomu jednoduše tak, že do nastavení (zpravidla je v samostatném souboru tiny_mce_init.js) přidáte řádek:

entity_encoding: 'raw',

více najdete zde: http://tinymce.moxiecode.com/wiki.php/Configuration:entity_encoding

Nebo, úplně základní potřeba je odlišit od sebe textarey, která budou obsloužena pomocí TinyMCE a která ne:
všechny prvky textarea kromě těch, kterým přiřadíte class='mceNoEditor' budou editovatelné pomocí Tiny MCE:

mode: 'textareas',
editor_deselector: 'mceNoEditor',

Pozor - pro ty, kteří bojují s javascriptem nenápadné upozornění - posledí řádek sady parametrů na konci nemá čárku - následuje za ním hned složená závorka }

Tak to tedy vypadá asi takhle:

tinyMCE.init({
parametr1: 'hodnota1',
parametr2: 'hodnota2',
poslední parametr: 'hodnota'
});