Bookmark and Share
Document Actions

Presentazione delle Skin di Plone

Up one level
Un parte consistente del funzionamento di Plone è determinata dalle skin. Qui vedrete come funzionano e come si personalizzano.

Uno skin determina esattamente come ogni documento debba essere visualizzato all'utente, incluse le immagini e lo stile che circonda il contenuto. Uno skin raggruppa molti elementi, inclusi quelli statici (come le immagini) e quelli dinamici (come gli script), circonda ogni parte del contenuto e presenta gli elementi in un certo modo. Uno skin è anche il posto dove potete inserire fogli di stile e JavaScript.

Il vostro sito Plone deve avere almeno uno skin che verrà usato come default, ma può avere tanti skin quanti ne vuole lo sviluppatore. Un utente potrebbe opzionalmente saltare da uno skin all'altro, se lo sviluppatore glielo permette. Lo skin di default di Plone è quello che vedete su http://plone.org, con l'interfaccia familiare blu e verde. Ma Plone non deve per forza avere questo aspetto – il suo look dipende da voi. Per esempio, date un'occhiata ad alcuni dei siti elencati su http://plone.net/sites, che offre diverse personalizzazioni dell'aspetto possibili.

I template e gli altri elementi che compongono uno skin sono registrati in uno strumento chiamato portal_skins. Uno dei vantaggi di questo sistema è che vi permette di separare completamente la presentazione, la logica e i dati e di riutilizzare il codice. In altre parole, se volete modificare il look dell'intero sito, non dovete modificare ogni singola pagina. Di solito basta modificare solo un paio di template o file CSS.

Quando diciamo “riutilizzare” il codice, intendiamo che non dovete scriverlo ogni volta. Per esempio, potete modificare la struttura di tutte le pagine del vostro portale modificando solo un template di base. Per esempio, uno dei template di base più comuni è il main_template. Esso offre la struttura logica per tutte le pagine del portale, ed è richiamato da tutti i template. Se personalizzate il main_template, tutti gli altri template verranno modificati.

Perciò se volete cambiare solo l'aspetto visivo delle vostre pagine (come la grandezza e il colore di alcuni titoli), basta modificare solo un file CSS. Se volete effettuare delle modifiche strutturali, potete semplicemente personalizzare il main_template, e tutte le visualizzazioni del tuo portale verranno modificate.

Usare i livelli dentro uno skin

Uno skin è diviso in collezioni logiche di template e script chiamati livelli. Alterando queste collezioni individuali date il permesso agli utenti di aggiungere facilmente componenti allo skin o di rimuoverli. I livelli sono rappresentati in uno skin attraverso un elenco gerarchico di cartelle. Ogni livello corrisponde al nome della cartella e ogni cartella contiene gli elementi dello skin.

L'ordine dei livelli in quell'elenco è il fattore chiave di come Plone trovi gli elementi. Ricordate il concetto di acquisizione? Questa è una costruzione molto importante per Plone, perciò è importante ripeterla: in un ambiente orientato agli oggetti standard, un oggetto eredita le sue funzioni da un genitore. In Plone e Zope un oggetto acquisisce anche delle proprietà e delle funzionalità dell'oggetto che lo contiene. Così, quando un elemento, come logo.jpg, viene richiesto dallo skin, lo skin guarda tra i livelli per trovare l'elemento. Lo skin inizia a guardare nel primo livello assegnato a quello skin (di default, il primo livello che viene considerato è custom). Se lo skin non trova l'elemento nel primo livello, passa al secondo. (Per scoprire qual'è il secondo livello che viene considerato, guarda nel tab Properties dello strumento portal_skins, “Layers (in order of precedence)". Parleremo di questo tra un attimo). Lo skin continua a cercare tra i livelli finchè non trova l'elemento che sta cercando. Se non lo trova, allora comparirà un errore 404.

Permettendo a livelli superiori di prendere la precedenza sui livelli inferiori, gli sviluppatori e gli amministratori ora hanno la possibilità di personalizzare e manipolare i loro siti in modo programmatico attraverso i livelli. Ad esempio, se non vi piace un particolare elemento dello skin di Plone, potete personalizzare il risultato spostando l'elemento che invece vi piace in un livello superiore così che avrà la precedenza su quello che non vi piace.

Potete classificare i vostri skin e i vostri livelli in Plone con lo strumento portal_skins, mostrato nella Figura 6.3. Per accedere allo strumento portal_skins, andate nella ZMI e cliccate su “portal_skins”.

strumento portal_skins

Figura 6.3. Lo strumento portal_skins che vi permette di gestire gli elementi dello skin e personalizzare il look del vostro sito.

Cliccando sul tab Proprietà in alto nello strumento portal_skins verranno mostrati tutti gli skin e i livelli che compongono l'aspetto del vostro sito, come mostrato nella Figura 6.4.

Proprietà portal_skins

Figura 6.4. Il tab Proprietà dello strumento portal_skins

L'elenco di questi livelli nella sezione Proprietà può sembrare abbastanza lungo. Tuttavia, questo notevole numero di livelli vi da un ampio grado di flessibilità e riutilizzo.

Diamo un'occhiata a come questi skins vengono visualizzati. Ogni skin viene visualizzato sulla sinistra, con un area di testo a destra che visualizza tutti i livelli dentro quello skin. Ogni livello è il nome di una cartella o di una vista sul file system (File System Directory View (FSDV)) visualizzati nel tab Contenuti. Un FSDV è un nuovo oggetto in Plone che vi permette di accedere direttamente agli elementi dello skin definiti nel file di sistema, invece di dover andare nel database oggetti di Zope. FSDV rende lo sviluppo e la customizzazione più facile. Leggendo direttamente gli oggetti dal file system è molto più facile per gli sviluppatori scrivere e modificare il codice del sito.

La tua prima personalizzazione

Torniamo alla sezione Contents dello strumento portal_skins: molte delle cartelle che potete vedere puntano alle aree del file di sistema. Se cliccate su un elemento contenuto in una delle cartelle dello strumento portal_skins, vi apparirà un pulsante Personalizza. Cliccate sul pulsante e sarete in grado di cambiare il codice dell'elemento; questa operazione crea una copia modificata dell'elemento a livello custom, che di default è il primo livello, che ha quindi priorità su tutti gli altri livelli.

Vediamo un semplice esempio. Cercate "main_template" nello strumento portal_skins. Nel tab Find, scrivete main_template nel campo “with ids” e cliccate il pulsante Trova. Zope vi mostrerà una lista di elementi che corrispondono alla tua query. L'elemento evidenziato con un asterisco rosso è l'elemento in cima allo skin.

Nel nostro caso, il main_template è posizionato in portal_skins – plone_templates. Cliccate il pulsante Personalizza che crea una copia del main_template a livello custom. Ora potete modificare questo template. Ad esempio potete aggiungere una semplice linea di testo prima di chiudere il tag </body>:

...

<div>

Powered by me

</div>

</body>

</html>

</metal:page>

In questo esempio, avete aggiunto il testo “Powered by me” in basso a sinistra nel vostro sito. Salvate le modifche e guardate il vostro sito: vedrete che in tutte le pagine del portale è visibile la frase scritta in basso, come mostra la Figura 6.5.

main_template

Figura 6.5. Personalizzando il main_template potete aggiungere elementi a tutte le pagine nel vostro portale.

Nota: se cancellate la versione personalizzata del main-template contenuta nel livello custom, tutte le pagine del vostro portale torneranno alla versione di default offerta da Plone nel livello plone_templates. Perciò, non vi preoccupare se qualcosa va storto quando personalizzate un elemento di Plone – se volete tornare alla versione precedente vi basta cancellare l'elemento personalizzato dalla cartella Custom.

by Dario Pollino last modified 2010-03-19 15:36
Contributors: Maurizio Delmonte, Davide Moro, Alice Narduzzo, Fabrizio Reale, Enrico Barra, Andrea Cannizzaro, Andrea D'Este, Maurizio Lupo, Giuseppe Masili, Dario Pollino, Matteo Sorba.