lunedì 18 febbraio 2008

Le alternative a FCK Editor

FCK Editor è un tool fantastico per le nostre pagine web, che ci permette di integrare un editor veramente completo e assolutamente compatibile con gli standard del w3c.
Recentemente però mi è capitato di chiedermi se esisteva qualche alternativa ugualmente valida, e magari più leggera.
Ebbene sì, l'ho trovata. Esiste un poco conosciuto ma ottimo editor, che si chiama Nicedit, e che si integra alla perfezione nelle nostre pagine web con appena una o due righe di codice.
NicEdit è un editor inline realizzato in Javascript e Ajax, che permette di editare facilmente il contenuto di una textarea o addirittura di un div a nostra scelta, permettendoci di aggiungere qualsiasi tipo di formattazione.
Il file da scaricare è molto piccolo, meno di 35kB in totale, e solo 10kB la cartella compressa. Per l'installazione sono richiesti solo due file, il js e le icone.
NicEdit supporta i seguenti browser:
IE 5.5+ / FF 2+ / Opera 9+ / Safari 3+

L'installazione è molto semplice.

  1. Scaricate la cartella compressa da qui: http://www.nicedit.com/index.php

  2. Scompattate la cartella e inseritela nel vostro sito.

  3. Nella HEAD della pagina inserite il seguente codice:

    <script src="nicedit/nicEdit.js" type="text/javascript"></script>


  4. Nella vostra pagina
    - se volete convertire tutte le textarea, usate questo codice:

    <script type="text/javascript">
    bkLib.onDomLoaded(nicEditors.allTextAreas);
    </script>

    - se invece volete convertire solo alcune specifiche textarea, usate questo codice:

    <script type="text/javascript">
    bkLib.onDomLoaded(function() {
    new nicEditor().panelInstance('textarea');
    });
    </script>

    - se volete personalizzare la barra degli strumenti dell'editor, è sufficiente modificare il codice precedente in questo modo:

    <script type="text/javascript">
    bkLib.onDomLoaded(function() {
    new nicEditor({buttonList : ['bold','italic','underline','strikeThrough','undo','redo']}).panelInstance('textarea');
    });
    </script>




Trovate molti altri esempi e suggerimenti qui: http://www.nicedit.com/examples.php
Una sola avvertenza: l'editor salva tutti gli "a capo" come <BR>, anzichè come <br />. Per sopperire a questo problema ho usato la funzione str_replace di php per sostituire tutti i primi con i secondi. Comunque se utilizzate l'HTML 4 anzichè l'XHTML, non c'è nessun problema.


Un altro editor di cui ho sentito parlare, ma che personalmente non ho ancora provato, è TinyMCE. Ve lo indico per correttezza, anche se mi sembra di intuire che sia più simile a FCK editor che non a NicEdit.


Link NicEdit: http://www.nicedit.com/index.php
Link TinyMCE: http://tinymce.moxiecode.com/index.php

8 commenti:

ToX ha detto...

tinymce l'ho implementato su un sito che sto sviluppando ma è un carrozzone rispetto a questo, oltre ad essere pesantissimo... questo è interessante, se produce un buon codice xhtml mi sa che sostituisco tinymce :)

elisa.cucco ha detto...

Il codice prodotto da NicEdit mi sembra abbastanza buono... La pagina che ho editato è rimasta validabile, a parte, come dicevo, i tag BR, che ho dovuto sostituire con una funzione di PHP, anche se penso che basti intervenire nel file js.

Maxc ha detto...

Grazie, lo proverò.
Io ho provato quello contenuto in dojo, visto quanto è pesante tutta la libreria stavo proprio cercando qualche cosa più leggera.

ciao

Anonimo ha detto...

NicEdit è molto facile da installare ma da quanto ho visto nella demo, non supporta l'upload di file.
TinyMCE invece ha un'ottima gestione delle immagini, organizzate in gallery.
Segnalo anche Spaw, anche lui supporta l'upload.

Anonimo ha detto...

Ho provato ad integrarlo con asp e quindi utilizzare la textarea per registrare i testi nel database, con IE funziona ma con FF no, formatta il testo ma al momento di inviare i dati mi lascia il campo vuoto

elisa.cucco ha detto...

Ciao Anonimo, stai parlando di NicEdit o di qualche altro editor citato nei commenti?
Sono capitata nel sito ufficiale qualche giorno fa e ho visto che è stata rilasciata una nuova release con delle nuove feature, tra cui la possibilità di avere un output in xhtml (in fase di sperimentazione). Me la devo guardare con calma, vi farò sapere.
Comunque l'ho già parzialmente testata in php su firefox e funziona, magari nei prossimi giorni posto un esempio veloce.

Anonimo ha detto...

il problema di nicEdit è che non puoi inviare il form tramite actionscript... il risultato è che nell'invio il campo risulta vuoto

Anonimo ha detto...

Tramite actionscript?

Posta un commento