Personal tools

TinyMCE

Feb 25, 2014

Integrazione degli Icon Font in Plone, in modo accessibile

Se dico 🐢 ♥ 🐍 capite tutti?

Integrazione degli Icon Font in Plone, in modo accessibile

Che sia una moda o una vera rivoluzione, l'uso degli icon font si sta diffondendo moltissimo, ma qualcuno ci mette in guardia sulla loro effettiva accessibilità

Sempre più i siti Web moderni abbandonano l'uso indiscriminato di icone per sostituirle con la tecnica degli icon font.

Toolbar di comandi su GitHubGuardiamo ad esempio la barra dei comandi di GitHub (un sito sempre aggiornato per quanto riguarda le tecniche di front-end). Credete ci sia anche solo un'immagine qui?

Da profano, posso spiegarvi la tecnica in due parole: sfruttare CSS (e la direttiva font-face) per mostrare un carattere Unicode all'interno del testo.

Dato che si parla di Unicode, ci sono centinaia di simboli che possono sembrare icone, eppure dopo tutto stiamo pur sempre parlando di caratteri! ☼ ✰ ⌂ ♥

Bello, eh?

read more

Dec 19, 2013

Come usare i widget Plone in semplici template HTML

Reverse engineering dei widget Plone: si può!

Come usare i widget Plone in semplici template HTML

Plone ha alcuni bellissimi widget HTML, ma cosa capita quando vogliamo "rubarli" e utilizzarli in un template? Due esempi (e un invito a tentare voi stessi!)

Nell'uso di tutti i giorni che facciamo del CMS Plone ci troviamo di fronte a una serie di comodi widget.
Se volessimo tentare una definizione di widget nel contesto Plone, potremmo dire "una porzione di HTML atta a definire la raccolta dati di una singola informazione". Se la definizione che ho tentato di dare vi sembra complicare le cose, proviamo ad essere più pratici:

  • per chiedere all'utente il proprio nome, viene usato un widget di tipo stringa che si traduce in un semplice campo input HTML
  • per chiedere una data ci si trova, invece, di fronte a un più complesso insieme di menù a tendina e a un calendario JavaScript, ma lo scopo finale è quello di raccogliere un'informazione di tipo data/ora.

Perché usare sempre gli stessi widget? Perché in questo modo forniamo un'interfaccia utente che diventa famigliare e ripetuta in tutti i contesti dove viene mostrato un form - che sia di invio mail, di inserimento di contenuti, ecc.

La strada maestra per poter generare i propri form general-purpose (e quindi riutilizzare questi widget) è l'uso di librerie di form (z3c.form in primis).

Cosa succede, però, se ci si trova a voler riutilizzare questi widget per altri scopi, non canonici, come realizzare un semplice form HTML partendo da una pagina bianca? E' quello che andremo a esplorare in questo articolo.

read more

Aug 22, 2013

Carica immagini in Plone con un semplice copia/incolla in TinyMCE!

come aggiungere immagini velocemente

Carica immagini in Plone con un semplice copia/incolla in TinyMCE!

Il prodotto collective.clipboardupload permette di inserire immagini dentro una pagina Plone copiandole e incollandole direttamente dentro l'editor TinyMCE

Il prodotto collective.clipboardupload fornisce una veloce scorciatoia per il caricamento di nuove immagini dentro una pagina, o in un qualsiasi altro oggetto con campo di testo, di Plone.

Inserimento di un'immagineIn genere, per inserire una nuova immagine in un campo di testo, dobbiamo seguire questo percorso:

  1. aprire il pop up di inserimento immagini facendo click sull'icona "ad albero" che troviamo nella barra degli strumenti dell'editor di testo
  2. fare click su "Upload"
  3. sfogliare le risorse della macchina locale, trovare e aprire l'immagine desiderata e fare click di nuovo su "Upload"
  4. Confermare l'inserimento con un click su "OK".

Con collective.clipboardupload inserisci l'immagine con un "copia/incolla"

read more

Jan 24, 2013

Plone: i bizzarri comportamenti di TinyMCE e Chrome

Filed Under:

Una soluzione all'espansione dell'area di testo TinyMCE attraverso le colonne laterali, che si verifica in Chrome

Nelle ultime installazioni di Plone 4 è emerso un bug molto fastidioso. Di tanto in tanto accade che, aprendo un contenuto in modifica, utilizzando il browser Chrome, la pagina si apra sbordando sul lato destro e uscendo completamente dal contenuto principale.

L'effetto è spiacevole, perché parte dei campi di input invadono i riquadri della colonna destra.

Ho potuto riscontrare lo stesso problema in una qualsiasi installazione di Plone 4, con il semplice utilizzo del tema Sunburst e nessun add-on.

Se l'utente ricarica la pagina, il contenuto centrale si ridimensiona tornando al proprio posto.

Il metodo per replicare il problema, con assoluta certezza che riaccada, è quello di aprire una pagina in modifica e spostarsi dal tab "Default" nel tab "Impostazioni" e poi tornare al tab "Default". Tutto questo succede usando Chrome.

Attraverso un serie di test ho potuto osservare che tale comportamento è dovuto alla presenza di almeno un campo con editor di testo TinyMCE.

 

read more

Nov 16, 2012

Sviluppare applicazioni Plone direttamente da interfaccia web con Plomino

Fusione Plone + Domino = Plomino

Sviluppare applicazioni Plone direttamente da interfaccia web con Plomino

Breve test di valutazione su Plomino, un pacchetto Plone per la creazione di applicazioni web in stile Lotus ® Notes direttamente da intefaccia grafica WYSIWYG

E' pratica comune fare test su estensione e prodotti Plone a scopo conoscitivo o per studio. Generalmente si esplorano pacchetti alla ricerca di soluzioni applicabili al lavoro di tutti i giorni, ma non di rado capita di soddisfare semplici curiosità.

logo_plominoRecentemente, grazie alla mia doppia partecipazione nei team Lotus ® Notes / Plone, mi è stato proposto di fare alcuni test su Plomino.

 

read more