typo3 themes

Download Typo3 themes

Post on 29-Jan-2018

288 views

Embed Size (px)

TRANSCRIPT

  1. 1. TYPO3 Themes - Ispiring people to share design TYPO3 Themes Ispiring People to share designs Cristian Buja
  2. 2. TYPO3 Themes - Ispiring people to share design
  3. 3. TYPO3 Themes - Ispiring people to share design Themes 2013
  4. 4. TYPO3 Themes - Ispiring people to share design Dipendenze di Theme Bootstrap (required extensions) Themes Bootstrap Themes Gridelements Gridelements Themes Static Info Tables Dyncss less Dyncss
  5. 5. TYPO3 Themes - Ispiring people to share design Ereditariet di Theme Bootstrap Themes Static Info Tables Themes Gridelements Gridelements Themes Bootstrap Dyncss less Dyncss
  6. 6. TYPO3 Themes - Ispiring people to share design Themes Creare loggetto PAGE Configurazione TypoScript automatica delle lingue Inclusione automatica di TSConfig, TypoScript Campi aggiuntivi (icone, behaviour, responsive, variants) Costanti TypoScript editabili dal modulo backend anche per non Admin
  7. 7. TYPO3 Themes - Ispiring people to share design Templates themes page = PAGE page { typeNum = 0 100 = USER 100 { userFunc = TYPO3CMSExtbaseCoreBootstrap->run ... settings =< plugin.tx_themes.settings persistence =< plugin.tx_themes.persistence view =< plugin.tx_themes.view } }
  8. 8. TYPO3 Themes - Ispiring people to share design Variabili themes in css_styled_content (TYPO3 6.2) KayStrobachThemesFrontendCssClassMapper->mapGenericToFramework responsiveMapping =< lib.content.cssMap.responsive responsiveRowMapping =< lib.content.cssMap.responsive.row responsiveColumnMapping =< lib.content.cssMap.responsive.column behaviourMapping =< lib.content.cssMap.behaviour specialBehaviourMapping =< lib.content.cssMap.behaviour. variantMapping =< lib.content.cssMap.variants iconMapping =< lib.icons.cssMap
  9. 9. TYPO3 Themes - Ispiring people to share design Variabili themes in css_styled_content (TYPO3 6.2) ES: tt_content.stdWrap.innerWrap.cObject.default.20 (COA) 40 = TEXT 40 { dataWrap = {field:tx_themes_responsive},{field:tx_themes_behaviour},{field:tx_themes_variants} postUserFunc = KayStrobachThemesFrontendCssClassMapper->mapGenericToFramework postUserFunc { responsiveMapping =< lib.content.cssMap.responsive behaviourMapping =< lib.content.cssMap.behaviour variantMapping =< lib.content.cssMap.variants } }
  10. 10. TYPO3 Themes - Ispiring people to share design Variabili themes in fluid_styled_content (TYPO3 7.6) KayStrobachThemesDataProcessingThemesVariantsDataProcessor KayStrobachThemesDataProcessingThemesBehaviourDataProcessor KayStrobachThemesDataProcessingThemesResponsiveDataProcessor KayStrobachThemesDataProcessingThemesResponsiveColumnDataProcessor KayStrobachThemesDataProcessingThemesIconDataProcessor
  11. 11. TYPO3 Themes - Ispiring people to share design Variabili themes in fluid_styled_content (TYPO3 7.6) ES: tt_content.stdWrap.innerWrap. (FLUIDTEMPLATE) dataProcessing { 30 = KayStrobachThemesDataProcessingThemesVariantsDataProcessor 40 = KayStrobachThemesDataProcessingThemesBehaviourDataProcessor 50 = KayStrobachThemesDataProcessingThemesResponsiveDataProcessor 60 = KayStrobachThemesDataProcessingThemesIconDataProcessor }
  12. 12. TYPO3 Themes - Ispiring people to share design Variabili themes in fluid_styled_content (TYPO3 7.6) Fluid styled content non ancora completamente supportata, occorre quindi implementare i layouts,templates e partials.
  13. 13. TYPO3 Themes - Ispiring people to share design Variabili themes e il mapping CSS lib.content.cssMap.responsive { ... medium-default = medium-hidden = hidden- md ... } lib.icons.cssMap { alert = glyphicon glyphicon- alert }
  14. 14. TYPO3 Themes - Ispiring people to share design Variabili themes e il backend themes.content.responsive.default { ... medium.visibility { default = LLL:EXT:theme_bootstrap/... hidden = LLL:EXT:theme_bootstrap/ } ... } TCEFORM.tt_content.tx_themes_icon.addItems { }
  15. 15. TYPO3 Themes - Ispiring people to share design Variabili themes e il backend
  16. 16. TYPO3 Themes - Ispiring people to share design Themes Gridelements Configurazione backend layout Configurazione gridelements
  17. 17. TYPO3 Themes - Ispiring people to share design Layout di pagina themes_gridelements 14 layouts con 4 aree di contenuto content colPos = 0 menu colPos = 1 sidebar colPos = 2 feature colPos = 3
  18. 18. TYPO3 Themes - Ispiring people to share design Contenuti di themes_gridelements 11 tipi di contenuti contenitore 2 colonne 3 colonne 4 colonne ... tabs
  19. 19. TYPO3 Themes - Ispiring people to share design
  20. 20. TYPO3 Themes - Ispiring people to share design Theme Bootstrap Implementazione dei templates di pagina e di contenuto
  21. 21. TYPO3 Themes - Ispiring people to share design Variabili themes e il backend
  22. 22. TYPO3 Themes - Ispiring people to share design Tema derivato theme_bootstrap_t3conitalia
  23. 23. TYPO3 Themes - Ispiring people to share design theme_bootstrap_t3conitalia
  24. 24. TYPO3 Themes - Ispiring people to share design Fluid Templates Manager ftm Extension builder per i temi ?
  25. 25. TYPO3 Themes - Ispiring people to share design Fluid Templates Manager ftm
  26. 26. TYPO3 Themes - Ispiring people to share design Fluid Templates Manager ftm
  27. 27. TYPO3 Themes - Ispiring people to share design Fluid Templates Manager ftm
  28. 28. TYPO3 Themes - Ispiring people to share design Fluid Templates Manager ftm http://bitbucket.org/interadev/theme_bootstrap_t3conitalia
  29. 29. TYPO3 Themes - Ispiring people to share design Grazie !