Templavoila Framework non permette di fare cose nuove ma fornisce un workflow basato su codice e best practices, per produrre siti di aspetto diverso in modo veloce e consistente usando TemplaVoila.

1. Creazione di skin con
Templavoila
Framework
Oratore: Maurizio Morini
T3Camp Italia Bologna 26/27 Novembre 2010
Il primo evento italiano dedicato a TYPO3 Novotel fiera Bologna

2. Creazione di skin con
Templavoila Framework
Maurizio Morini
● Sono socio fondatore di Gamm System Srl
● Solgo la funzione di coordinatore dello sviluppo web
● Lavoro con TYPO3 dal 2005, affrontando problematiche
di analisi, pianificazione e sviluppo per varie tipologie di clienti.
● morini@gammsystem.com
Pag. 3 http://www.t3campitalia.it/

3. Creazione di skin con
Templavoila Framework
INTRODUZIONE
● Templavoila (TV) è il metodo di templating più potente in Typo3.
● Con Templavoila qualsiasi layout HTML può essere integrato in Typo3
● Necessaria una discreta conoscenza di Typo3 e typoscript
Pag. 4 http://www.t3campitalia.it/

4. Creazione di skin con
Templavoila Framework
Templavoila Framework semplifica e razionaliza l'uso di TV in Typo3.
Pag. 5 http://www.t3campitalia.it/

5. Creazione di skin con
Templavoila Framework
SKIN:
● Il layout del sito è racchiuso in una skin
● Viene installata in Typo3 come un'estensione
● Può essere cambiata con un semplice click
Ecco alcuni esempi dello stesso sito web con skin diverse:
Pag. 6 http://www.t3campitalia.it/

6. Creazione di skin con
Templavoila Framework
Pag. 7 http://www.t3campitalia.it/

7. Creazione di skin con
Templavoila Framework
Pag. 8 http://www.t3campitalia.it/

8. Creazione di skin con
Templavoila Framework
Pag. 9 http://www.t3campitalia.it/

9. Creazione di skin con
Templavoila Framework
Pag. 10 http://www.t3campitalia.it/

10. Creazione di skin con
Templavoila Framework
APPROCCIO TEMPLAVOILA
TEMPLATE MAPPATURA
HTML TEMPLAVOILA
CREAZIONE
PAGINE e
CONTENUTI
TEMPLATE MAPPATURA
HTML TEMPLAVOILA
Pag. 11 http://www.t3campitalia.it/

11. Creazione di skin con
Templavoila Framework
MAPPATURA TEMPLAVOILA
Pag. 12 http://www.t3campitalia.it/

12. Creazione di skin con
Templavoila Framework
CREAZIONE CONTENUTI
Pag. 13 http://www.t3campitalia.it/

13. Creazione di skin con
Templavoila Framework
APPROCCIO TEMPLAVOILA FRAMEWORK
CREAZIONE TEMPLATE
PAGINE e HTML
CONTENUTI
LIBRERIA CREAZIONE
SKIN SKIN
Pag. 14 http://www.t3campitalia.it/

14. Creazione di skin con
Templavoila Framework
APPROCCIO TEMPLAVOILA FRAMEWORK
● Preparo l'installazione di base del sito e posso subito lavorare: possiamo già creare
le pagine e i contenuti del sito utilizzando un template di base: Questo permette di
iniziare fin da subito ad organizzare i contenuti e la navigazione del sito, etc.
● Lo sviluppo della skin è “indipendente” dai contenuti. Abbiamo sempre un template
html come in Templavoila, ma quello che devo fare è scrivere qualche riga di
typoscript e gestire gli stili CSS necesssari. Senza mappature Templavoila.
Pag. 15 http://www.t3campitalia.it/

15. Creazione di skin con
Templavoila Framework
Categorie di contenitori
e Layout di pagina
● Header
● Feature
● Generated Content Block 1
● Main Content, Content Area 2, Content Area 3
● Generated Content Block 2
● Footer
Pag. 16 http://www.t3campitalia.it/

16. Creazione di skin con
Templavoila Framework
Pag. 17 http://www.t3campitalia.it/

17. Creazione di skin con
Templavoila Framework
Pag. 18 http://www.t3campitalia.it/

18. Creazione di skin con
Templavoila Framework
Pag. 19 http://www.t3campitalia.it/

19. Creazione di skin con
Templavoila Framework
Utility FCE
● Columns
● Modules
● HTML Wrapper
● Plain Image
● Module Feature Image
Pag. 20 http://www.t3campitalia.it/

20. Creazione di skin con
Templavoila Framework
Layout Backend
Pag. 21 http://www.t3campitalia.it/

21. Creazione di skin con
Templavoila Framework
DEMO
Pag. 22 http://www.t3campitalia.it/

22. Sponsors
Pag. 23 http://www.t3campitalia.it/