Usare i CSS con TinyMCE

Ormai il mio "editor" web di default è TinyMCE.

Mi ci trovo molto bene, ed ha tutto quello che serve.

Ultimamente mi sono scontrato con un problema: impostare dello stile all'interno del testo dentro l'editor.

Nello specifico, dovevo usare un font preso da Google Web Font.

All'inizio ho pensato di agire all'interno del codice sorgente del testo; ma si è rivelata una operazione inutile.

Allora ho trovato che bastava usare un'opzione in fase di inizializzazione dell'editor.

Nel complesso questa la mia configurazione:

    tinymce.init({
        selector: "textarea#testo",
        width: 700,
        height: 600,
        toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image | print preview media fullpage | forecolor backcolor emoticons hr",
        plugins: [
            "advlist autolink link image lists charmap print preview hr anchor pagebreak spellchecker",
            "searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking",
            "save table contextmenu directionality emoticons template paste textcolor"
        ],
        relative_urls: false,
        remove_script_host: false,
        convert_urls: true,
        content_css: "http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300"
    });

Quello ci interessa in questo caso è l'opzione content_css.

Come valore dobbiamo dargli il percorso del CSS da prendere; in questo caso l'indirizzo del font fornito da Google.

Enjoy!