Aký WYSIWYG editor považujem za dokonalý?

Aký WYSIWYG editor považujem za dokonalý?

Existuje veľké množstvo WYSIWYG editorov ale takmer žiadny mi nevyhovuje na 100%. Zásadne sa vyhýbam takým, ktoré nie sú cross browser resp. nie sú určené pre všetky (majoritné) prehliadače. Stalo sa mi už, že som našiel aj editor, ktorý sa mi veľmi páčil ale opäť mal svoje nedostatky. Napríklad chýbajúca podpora pre application/xhtml+xml alebo nemožnosť vytvárať tabuľky, nahrávať obrázky (toto je však možné doprogramovať), či príliš komplikované odosielanie obsahu. Dnes som však našiel vhodného kandidáta, na ktorom by sa dal postaviť celkom slušný cross browser WYSIWYG editor s podporou application/xhtml+xml a image/file upload funkciou. Je ním WidgEditor. Rôzne iné editory ponúkajú zmenu vzhľadov, vkladanie smajlíkov, fullscreen, layery a pod. "užitočné" funkcie, ktoré potom spolu tvoria aj stovky kB kódu a takmer nikto ich nevyužije.

WidgEditor

Pre mňa nevhodným editorom je TinyMCE. Je zbytočne veľký, nabitý nie pre každého dôležitými funkciami. Naštastie je možné si ho jednoducho prispôsobiť a určiť, ktoré funkcie áno, či nie. Aj napriek tomu však trvá dosť dlho jeho celkové načítanie, a to ešte nehovorím o dobe prenesenia cez FTP. Riešením by bolo vyhádzať všetky pluginy a vzhľady čo nepotrebujem.

Ďalším nevhodným príkladom môže byť aj XStandard. Keby nebol vytvorený cez ActiveX bol by to bezkonkurenčne najlepší editor na svete. Otázkou je, či sa niečo podobné bez ActiveX dá vôbec naprogramovať. Určite áno, pokiaľ by všetky prehliadače podporovali XUL, bol by internet iný. Kvôli tejto "maličkosti" ho nemôžete používať v Opere. Existuje tu riešenie ale je to veľmi neefektívne. XStandard už od istej verzie funguje aj v Opere.

Implementácia

TinyMCE, XStandard aj väčšina ostatných editorov má mierne zložitý alebo veľmi zložitý spôsob implementácie. WidgEditor zvládne implementovať ktokoľvek. Stačí do hlavičky pridať nasledujúce riadky a každá <textarea> sa vám zmení na WYSIWYG editor.

<style type='text/css' media='all'>
  @import "css/info.css";
  @import "css/main.css";
  @import "css/widgEditor.css";
</style>
<script type='text/javascript' src='scripts/widgEditor.js'></script>

Zhrnutie

Zatiaľ na svete neexistuje (alebo ešte o ňom neviem) WYSIWYG editor, ktorý by spĺňal moje požiadavky. WidgEditor sa mi páči, ale aj tomu chýbajú funkcie pre tabuľky, obrázky/súbory atď. WidgEditor plánujem pridať do SigmaCMS, takže si spomínané veci doprogramujem sám. Zdá sa, že Midas ako XHTML editor nepostačuje. Páni z W3C by mali porozmýšlať o vhodnom riešení…

Alternatívne verzie: Text PDF Voice
Autor: PaBi3 · Kategória: Webdesign · Dátum: 28.01.2007 17:26

Komentáre

#1 mat
28.01.2007 19:11
XStandard už pomerne dlhšiu dobu funguje aj v Opere, a to bez kadejakých pochybných riešení.

#2 admin Web E-mail
28.01.2007 20:57
admin [1] mat, dobre vedieť. V časoch, keď som ho používal Operu nepodporoval. Jeho nevýhoda však stále zostáva v tom, že si ho musí klient inštalovať.

#3 XcoRpi E-mail
28.01.2007 20:57
Skúšal si už XStandard WYSIWYG?
http://www.xstandard.com/

Alebo texty?
http://texy.info/ nie je to zrovna WYSIWYG ale…

#4 admin Web E-mail
28.01.2007 21:03
admin O XStandard píšem v článku. Je skvelý ale nie je použiteľný na počítačoch, kde nie je nainštalovaný. Práve kvôli tomu mi nevyhovuje.

Texy za WYSIWYG editor nemôžem považovať. Ani ako náhradu. Niektoré blogy používajú Texy aj v komentároch ale za logickejšie riešenie považujem napr. také, ako je na tejto stránke.

#5 dusoft Web E-mail
29.01.2007 02:20
o Widg som pisal uz davnejsie, je to stara vec. je vsak prudko obmedzeny funkciami, co moze postacovat pre zakladne editovanie, nie vsak uz narocnejsie potreby.

#6 admin Web E-mail
29.01.2007 06:55
admin [5] dusoft, je síce starý ale dobrý.
WidgEditor je veľmi kvalitne napísaný a je jednoduché ho rozšíriť. Už mám hotové nahrávanie súborov a bola to otázka niekoľkých riadkov, ak nerátam samotnú upload aplikáciu. Chystám sa doplniť aj vkladanie tabuliek, čo myslím bude tažšie. Potom by však mal postačovať aj na náročnejšie potreby.

#7 curo
29.01.2007 10:13
A co FCKeditor? http://www.fckeditor.net/

#8 admin Web E-mail
29.01.2007 20:34
admin [7] curo, žiaľ je to ďalší prípad, ktorý nie je cross browser.

#9 mattonik E-mail
30.01.2007 18:51
a skusal si toto: http://www.wymeditor.org/en/
je to editor zalozeny na xhtml standardoch. nie je ani velky, v pohode sa nacita, tiez celkom lahko modulovatelny aj ked zatial som sa nemal cas tomu venovat podrobnejsie

#10 admin Web E-mail
30.01.2007 18:57
admin [9] mattonik, WYMEditor funguje na základe <div>u, ktorý má atribút contentEditable, takže ho nie je možné použiť pri MIME type application/xhtml+xml.

#11 Tomas Web
31.01.2007 17:38
dal som si tento editor (widgeditor) na stranku, kde pouzivam xstandard (ked niekto nema xstandard, tak sa objavi v alternate textarea tento editor) ale ked som chcel urobit v IE nejaku editaciu obsahu, tak mi ho otvorilo, upravil som, odoslal som - potom som zbadal, ze som sa pomylil, a chcel som otvorit znovu - ie vsak vypisalo nejaku chybu v plugine got flash (alebo co, ja neviem), zamrzlo a padlo - tak som to vyskusal znovu, a znovu to iste ... takze v trabante je dalsia chyba (mozno sa da aj zneuzit)

#12 mattonik E-mail
06.02.2007 22:44
[10] admin,
no priznam sa, ze tomu moc nerozumiem, ak by sa naslo dake kratke vysvetlenie, bol by som vdacny.

#13 admin Web E-mail
06.02.2007 23:03
admin Vyskúšaj si to sám:
<div contenteditable='contenteditable'>Lorem ipsum</div>.

Užívateľ môže meniť obsah elementu <div> rovnako ako je to pri designMode nastavenom na on. Nezabudni si všimnúť rozdiel pri testovaní s MIME text/html a application/xhtml+xml.

#14 shuster Web E-mail
23.02.2007 14:37
Skusal si uz wysiwyg SPAW?
tu je demo: http://www.solmetra.com/spaw/demo/demo.php
tu je verzia 2: http://www.solmetra.com/en/disp.php/en_products/en_spaw/en_spaw_demo

#15 admin Web E-mail
26.02.2007 20:28
admin [14] shuster, SPAW je skvelý pokiaľ nepoužívaš application/xhtml+xml. Je to jeden z najlepších WYSIWYG editorov vôbec.

#16 jkw E-mail
17.03.2007 17:52
ahoj.. chcem sa opytat k WidgEditoru... ako sa robi implementacia? ked idem podla postupu vyssie tak mi to nefunguje.. a ako mozem pomocou tohto editoru editovat povie priklad 5 html suborov? dakujem.

#17 admin Web E-mail
18.03.2007 07:32
admin [16] jkw, pokiaľ ste postupovali podľa implementácie, skúste do formulára vložiť nasledujúci kód:
<textarea id='editor' name='editor' class='widgEditor'>test</textarea>

#18 fox
19.03.2007 12:55
Dokaze ten editor odstranit aj formatovanie textu ak tam niekto prilepi text napr. z WORDu?


#20 fepa
31.10.2007 23:37
a co takto Easy Editor?

#21 admin Web E-mail
02.11.2007 10:29
admin [20] fepa, nepodstatné, pretože to nie je nástroj priamo v prehliadači.

#22 Czario E-mail
02.11.2007 23:15
Ahoj, mám pár otázek. Z toho co jsem si přečetl, tak 2 největší hráči jsou tinyMCE a FckEditor. Ale ty jsou až moc robustní a pro potřeby nezahrnující vytváření kompletního webu vcelku zbytečné.
Jsou ještě nějací takovíto giganti?

Jsou nějaké podobné debaty nebo stránky věnované této problematice?

#23 Czario E-mail
05.11.2007 12:24
Měl bych ještě pár otázek, ale nyní přímo k widgEditoru.
V readme jsem narazil, že se tam píše podpora pro Internet Exporer 5.5+ a Mozilla 1.3+. Jak to vypadá s Operou, novým IE7 a Konquerorem? (ani jeden nepoužívám, proto se ptám)

Poslední modifikace byla v roce 2005. Znamená to, že autor daný editor již nehodlá rozvíjet? Není to škoda, když říkáte, že je to jeden z mála dobrých a kvalitních editorů?

A ještě jedna otázečka, jak to je s korektností kódu v xhtml strict (to co už je implementováno jestli je plně validní a ošetřeno)?

#24 admin Web E-mail
05.11.2007 20:39
admin [22] Czario, napríklad celkom rozsiahly zoznam nájdete na tejto adrese: http://www.geniisoft.com/showcase.nsf/WebEditors.

[23] Czario, máte pravdu autor už asi projekt nevyvíja. Nenapísal som, že je vhodný na používanie ale dal by sa na ňom postaviť dobrý editor. Pamätám si, že jeho funkčnosť bola trochu odlišna v rôznych prehliadačoch ale na konkrétne príklady si už nespomeniem. Stačí vedieť, že existujú. V Konquerore som nikdy widgEditor neskúšal ale keď ste sa pýtali tak som tak učinil a výsledok bol negatívny, teda widgEditor nefungoval. V Opere a myslím, že aj v IE7 funguje. Generovaný kód posúdte sami.

#25 Czario E-mail
06.11.2007 22:02
[24] admin, aha. Děkuji za odkazy. Určitě se na widgEditor podívám podrobněji. Ono něco takového přesně potřebuji. Mam totiž na dané téma bakalářskou práci (vytvořit či editovat existující wysiwyg js editor pro validní xhtml). Jinak tento článek je pořád aktuální a onen widgEditor je pořád Váš oblíbený, nebo jste již změnil názor? (trochu jste mě vystrašil s tím odlišným chováním v různých editorech.)

#26 admin Web E-mail
08.11.2007 18:11
admin [25] Czario, nepoužívam často WYSIWYG editory a radšej píšem v čistom XHTML. Keď mám prácu na objednávku, tak môžem tieto editory maximálne doporučiť ale vyberá si objednávateľ.

#27 Viktor Web E-mail
22.11.2007 18:23
Zdravicko :)

Tak podla mna zase vychvalit privelmi jednoduchy editor preto ze je lahko implementovatelny a jednoduchy je blbost. Ak sa na to chceme pozriet z hladiska moznosti ... nieje problem s tyniMCE spravit editor ktory je tu tak vychvaleny ... a stale je moznost povolovat dalsie moduly. To co je tu vyssie popisane je podla mojho nazoru adresovane skor pre vikendovych programatorov ktory beru pisanie webov ako konicek. Pri profesionalnych projektoch je podla mna TinyMCE uplne perfektna vec ... je len narocnejsi na nastavenia. Ale nieje to nahodou prave praca programatora ? Taktiez pouzitie editoru na vsetky textarea v kode je dost neprakticke ... nikdy nevies co mozes potrebovat. Takze ak by som sa ja osobne mal zamerat na poziadavky tak by som sa orientoval na: validitu a jednoduchost generovaneho kodu, spektrum moznosti a rekonfigurovatelnost a v neposlednom rade licencia ... ja sa orientujem na LGPL produkty.

#28 admin Web E-mail
23.11.2007 20:20
admin [27] Viktor, možno keby si si prečítal článok poriadne, tak by si vedel prečo som ho pochválil. Napísal som, že by sa na ňom dal postaviť dobrý WYSIWYG editor. Ak píšeš, že sa zameriavaš aj na validitu a jednoduchosť, tak je nezmysel tieto slová spájať s TinyMCE.

#29 Tomas Web
01.12.2007 22:43
Zdravim, nasiel som obrovsku chybu velku ako svet, nachadzajucu sa v tomto editore!!!!

ked date donho nejaky text z mysql, nacitany na editaciu, tento krasny editor zrusi uzatvaracie tagy </li> v necislovanom zozname <ul> (cislovany som neskusal)

nema tu niekto tusenie, ako tuto chybu odstranit? mal som jedno php riesenie, ale to fungovalo iba dovtedy, kym sa neobjavil vnoreny zoznam. fungovalo to na spatnej uprave odoslaneho chybneho kodu z editora ...

#30 Czario E-mail
13.12.2007 13:00
Ahoj, zjistil jsem, že v podstatě všechny editory, které jsem viděl fungují na principu iframe a využití integrovaného editoru v prohlížeči(pokud se tedy nepletu, pokud ano, rychle mě opravte a vysvětlete mi to please).
Tzn.: Problém je v tom, že iframe je v xhtml 1.0 strict zakázán. Sice tyto editory generují validní strict, ale když se sami přidají do nějaké stránky, která je strict, tak jí znevalidní, protože do stránky tak jako tak přidají iframe.
Co s tim? Nejde to nějak jinak než přes iframe? Ony integrované editory využívané wysiwyg editory se také zapínají na celé body. Tzn na celou stránku. Takže omezení editoru jen na určitou část zřejmě nejde (aby se vyřešil problém s iframe).

Poradíte mi a vysvětlíte mi to, prosím? (celkem nutně potřebuju znát jaké mam možnost atd.. Dělám vlastní xhtml 1.0 strict wysiwyg editor)

#31 czario E-mail
13.12.2007 16:57
[30] Czario,
tak jsem zatím přišel na tag <object>. Nevím zatím až jak se dá pro daný problém použít, ale pokud je vhodný, tak je otázka, proč ho nepoužívají stávající wysiwyg editory...

Co říkáte na tento tag? Něco jsem zatím zkoušel a ve firefoxu a opeře to pomocí objectu a zapnutí interního editoru na zdrojové stránce pomocí document.designMode='on'; zatím celkem funguje. (jen jednoducháé přepisování textu. Víc jsem zatím ještě neotestoval)

Zná někdo editor co používá object nebo něco jiného místo iframe, co je validní vzhledem k xhtml 1.0 strict a tedy v podstatě i pro xhtml 1.1?

#32 admin Web E-mail
13.12.2007 20:51
admin [31] czario, skúste použiť tag <object> napr. v Internet Exploreri 6.

#33 xsitepro Web E-mail
04.06.2011 17:49
[3] XcoRpi,
A čo tak XsitePro? Podľa mňa to je momentálne najlepší wysiwyg editor na trhu pretože spája tvorbu kvalitných a plnohodnotných webstránok s úplnou jednoduchosťou a funkciami.

Osobné údaje
Captcha
Odpíšte text z obrázku. Rozlišujú sa malé a veľké písmená.
Obsah
Možnosti