Dopo la modalità di integrazione, molto importante è la personalizzazione delle toolbar dei pulsanti, forse la vera personalizzazione di TinyMCE.

Profili di personalizzazione

Esistono due differenti profili (themes – temi) per la configurazione dei pulsanti: simple e advanced.

Simple Theme (Tema semplice)

La versione semplice non prevede alcuna modifica ai pulsanti e integra di base i pulsanti più comuni e importanti quali grassetto (bold), corsivo (italic) e sottolineato (underline) insieme agli elenchi puntati/numerati e la gestione dei links.

Questa soluzione è quella di default di TinyMCE e per questo NON vi inserirò alcuna riga di codice: non scrivendo nulla, il vostro tema sarà quello semplice.

Di norma, questa soluzione potrebbe rivelarsi sufficientemente utile se nel vostro sito dovete limitarvi ad inserire dei testi, delle news, degli annunci. Spesso però i testi che dovrete inserire saranno provenienti da documenti di Word e, vi anticipo, non sarà così bello. Word infatti si porta dietro un alto numero di tag creati da Microsoft che vi impediscono di avere un codice pulito e formattato come voi volete. Ecco perchè forse preferirete il tema Avanzato.

Advanced Theme (Tema avanzato)

La versione advanced permette una configurazione decisamente più ampia. I modi per personalizzarla sono molti, ma come consiglio (e per comodità) vi suggerisco di utilizzarla sempre nella sua versione estesa e impostare manualmente solo i “pulsanti” interessati.

Andiamo allora a modificare lo script inserito nella fase di installazione di TinyMCE aggiungendo le righe di codice dell’esempio:

tinyMCE.init({
  ...
  theme : "advanced",
  theme_advanced_buttons1 : "inserttime,preview,zoom,separator,forecolor",
  theme_advanced_buttons2 : "bullist,numlist,separator,outdent,indent,separator",
  theme_advanced_buttons3 : ""
});

Lo script precedente non necessita di molte spiegazioni: dichiariamo che utilizzeremo il tema avanzato (theme : “advanced”) e dichiariamo nelle righe successive quali bottoni dovranno apparire nelle 3 righe dell’editor. L’elenco dei bottoni che potete inserire, con la loro dichiarazione, lo trovate qui.