CKEditor - WYSIWYG HTML editor

Ritratto di Vanni

Questo modulo e' utilissimo a chi deve scrivere parecchie pagine nel proprio sito web. Aggiunge al normale campo d'inserimento testo, che offre Drupal quando si crea una nuova pagina, dei bottoni per inserire, senza usare codice html e css, caratteri in grassetto, corsivo, immagini, tabelle, emoticon ecc.. e in piu' fa anche il controllo dell'ortografia e molte altre funzioni. (Un modulo simile è Wysiwyg)

Come funziona il modulo CKEditor

Innanzi tutto si deve scaricare il modulo da questa pagina. Poi bisogna scaricare la libreria che andra' inserita dentro al modulo, in questa pagina (e' consigliata la versione full). Molto spesso si usa CKEditor assieme al modulo IMCE con il quale possiamo caricare immagini nel nostro sito tramite apposita interfaccia senza dover attivare una connessione ftp.

Decompresso il file del modulo, si deve aprire la cartella e dentro ci si trovera' un'altra cartella denominata ckeditor con all'interno il file COPY_HERE.txt, qui si andra' ad inserire la cartella decompressa della libreria che abbiamo scaricato precedentemente. La libreria può essere caricata anche in sites/all/libraries (e forse è la soluzione migliore, in quanto dopo si può gestire/aggiornare la libreria in maniera indipendente dal modulo). Caricate il modulo in drupal e attivatelo. 

Ora se andiamo a creare un nuovo contenuto per una pagina del nostro sito, troveremo che i campi di testo saranno trasformati.

campo di testo modificato con il modulo ckeditor

Sulla parte superiore sono presenti tutti i pulsanti utili a creare nuovi contenuti. Inoltre, siccome il modulo CKEditor crea un campo WYSIWYG, si vede subito come apparirà la pagina con i vari effetti applicati al testo. 

Se si vuole il campo di testo in maniera classica, basta cliccare sulla scritta "Switch to plain text editor".

Come inserire un link

Per inserire un link basta scrivere la parola a cui verra' ancorato il collegamento, la si evidenzia col mouse e poi si clicca sull'apposito simbolo.

simbolo per inserire un link

Si aprira' una finestra in cui andremo ad inserire l'url del link, la destinazione ed eventuali attributi e css.

finestra per l'inserimento di un link con ckeditor

Come inserire un'immagine

Per inserire un immagine, cliccare sull'apposito simbolo

simbolo pulsante per caricare un'immagine

Si aprira' una finestra in cui dovete inserire l'Url della foto, il testo alternativo, eventuali dimensioni immagine; inoltre potete usare l'immagine come link (cliccando su collegamento) e in avanzate potete inserire attributi HTML e CSS.

finestra per caricare un'immagine

Come inserire un emoticon

  • cliccare sull'apposita icona
  • icona di ckeditor per scegliere un emoticon
  • si aprirà una finestra con un elenco di faccine tra cui scegliere
  • finestra con tutte le emoticon disponibili
  • se le emoticon messe a disposizione da CKEditor non vi soddisfano, consiglio l'uso del modulo Smiley

Commenti

Ritratto di Vanni

Ciao Stylead, prova ad andare

Ciao Stylead, prova ad andare nella pagina di configurazione di CKEditor, scegli il "Profilo" che ti serve, clicca modifica, clicca "Opzioni Avanzate", e nella textarea "Custom JavaScript configuration" inserisci la stringa: config.allowedContent = true;

Aggiungi un commento

Filtered HTML

  • Indirizzi web o e-mail vengono trasformati in link automaticamente
  • Elementi HTML permessi: <a> <em> <strong> <cite> <blockquote> <code> <ul> <ol> <li> <dl> <dt> <dd>
  • Linee e paragrafi vanno a capo automaticamente.

Comment

  • Elementi HTML permessi: <a> <em> <strong> <cite> <blockquote> <code> <ul> <ol> <li> <dl> <dt> <dd>
  • Linee e paragrafi vanno a capo automaticamente.
  • Indirizzi web o e-mail vengono trasformati in link automaticamente

Plain text

  • Nessun tag HTML consentito.
  • Indirizzi web o e-mail vengono trasformati in link automaticamente
  • Linee e paragrafi vanno a capo automaticamente.
Per tutelare la vostra privacy suggerisco l'uso di un nickname o lasciare anonimo...
CAPTCHA
Questa domanda e' per testare se sei un visitatore persona e non un software che genera spam
5 + 2 =
Risolvi la semplice domanda di matematica e inserisci il risultato. Es. se e' 1 + 3 inserisci 4.