Inserire immagini via FCK Editor su MWPSK

FCK Editor è uno dei migliori editor di testo per HTML sul mercato. Recentemente giunto alla versione 2.6.2, l’editor non richiede installazione sul client finale ed è estremamente semplice da installare. Un copia e incolla della cartella che si scarica da SourceForge, poche semplici configurazioni e via.

Vi sono tuttavia degli scenari dove la semplice integrazione richiede alcuni passi necessari per poter funzionare anche in ambienti più complessi. Uno di questi è il My Web Page Starter Kit.

Questo CMS open source di casa Microsoft, la cui caratteristica è quella di lavorare su file xml – quindi una massima trasportabilità del contenuto con un sermplice copia e incolla – prevede la memorizzazione dei file utente dentro la cartella App_Data, che di regola non è accessibile come percorso diretto dal browser. Ne consegue che, pur configurando l’editor per fare in modo che i file caricati vengano memorizzati all’interno di questa cartella, comunque la successiva selezione del file e la scrittura del tag da parte dell’FCK porterebbe ad una immagina inesistente.

Per tale accesso bisogna far uso di un handler appositamente scritto dal team che lavora sotto il nome di ImageHandler.ashx, al quale, fornendo il percorso relativo completo, gli si dice di restituire uno stream con l’immagine di nostro interesse.

Fino a qui nulla di nuovo.

Ora però mettetevi nei panni di un utente medio, quello che deve utilizzare il CMS e basta. Dirgli ogni volta di aggiungere un prefisso quale /ImageHandler.ashx?image= è piuttosto complicato oltre che infinitamente dispensioso in termini di tempo.

E’ necessaria allora una piccola modifca ad un file dell’editor, affinchè ad ogni selezione del file sia lui a fare questa aggiunta in automatico. Per ottenere il risultato, si può procedere in questo modo:

  1. Localizzare la cartella dove avete memorizzato i files dell’editor
  2. Spostarsi all’interno del seguente percorso: editor/filemanager/browser/default
  3. Aprire (con un notepad o con un qualsiasi editor HTML) il file frmsourcelist.html
  4. Trovare la seguente occorrenza: var sLink = ‘< a fileurl=”””” onclick=”””OpenFile(\””” href=”””#””””#”””>’ ;
  5. Sostituirla con: var sLink = ‘< a fileurl=”””” onclick=”””OpenFile(\’/ImageHandler.ashx?image='”” href=”””#””””#”””>’ ;

Il gioco è fatto. Da questo momento in poi, ogni file selezionato dal file browser, aggiungerà in automatico per noi il codice html corretto per poter caricare le immagini tramite l’handler. Ovviamente questa modifica comporta anche l’aver settato correttament il file di configurazione del connector, tale config.ascx, affinchè salvi i file nella cartella App_Data.