Primi passi col tema

Per poter personalizzare il tema, dovremo agire in diversi posti, in diversi files e cartelle, è quindi utile capire dove trovare le cose. Il riferimento più completo è ovviamente Plone Theme Reference, ma è un po' troppo esteso.

Per iniziare basta sepere che ogni cartella del tema ha questa struttura:

• Browser
  nella quale mettere i files template Plone .pt* che si potrebbe voler modificare
  • Images
  • Stylesheet
    contiene main.css, lo stile del sito su cui agire con le modifiche
• Profiles
  • Default
    contiene viewlets.xml, il file da modificare per nascondere/mostrare elementi della pagina
• Skin
  • ..._images
    contiene le immagini che si vogliono usare nel tema
  • ..._templates
    nel quale mettere i files template .pt* che si potrebbe voler aggiungere
  • ..._styles
    contiene base_properties.props il primo file su cui agire per personalizzare un tema
    

*NB

I template Plone per i vari elementi, sono dei files .pt che si trovano in eggs/plone.app.layout. Per modificarli, li si copia nel proprio tema e lì, li si modifica dove occorre. Per avere questa configurazione è utile un file di configurazione aggiuntivo al buildout, quel develop.cfg citato all'inizio. Questo il codice che contiene.

[buildout]
extends = buildout.cfg
  
parts+=
    omelette
    pydev

eggs +=
    stxnext.pdb

[zeoserver]
effective-user =

[instance]
eggs +=
    plone.reload

zcml +=
    plone.reload
    stxnext.pdb

[omelette]
recipe = collective.recipe.omelette
eggs =
    ${instance:eggs}

products =
    ${instance:products}

[pydev]
recipe = pb.recipes.pydev

eggs =
   ${instance:eggs}
extra_paths =
   ${omelette:location}
   ${zope2:location}/lib/python
pydevproject_path = ${buildout:directory}/.pydevproject

 Personalizzare le proprietà di base

Per le prime modifiche, si può agire su un solo file, basta modificare:
Skin/.._styles/base_properties.props

Per chi vuole approfondire la cosa, esiste una pagina di riferimento sulle base_properties

In base_properties.props si può agire per cambiare:

• immagine del logo (che deve esistere e va posionata in skin/..._images)
• tipo di font del sito
• dimensione dei font
• colori del testo
• colori dei link
• colori dei menù di Plone
• dimensioni delle colonne del contenuto
  

Per modificare altri aspetti della grafica

Per modificare qualsiasi altra proprietà, occorre modificare il file browser/stylesheet/main.css e il metodo più comodo è quello di utilizzare Firebug, per scoprire quali classi modificare.

In generale la documentazione utile per capire dove agire è Working with CSS e per vedere istantaneamente le modifiche, si può far riferimento a How to Make Your CSS Changes Take Effect Instantly