TYPO3 - Template-Auswahl: Unterschied zwischen den Versionen
Aus Wikizone
| Zeile 2: | Zeile 2: | ||
== Template Switcher Extension == | == Template Switcher Extension == | ||
| − | Funktioniert sehr zuverlässig. Thumbnails möglich. | + | Funktioniert sehr zuverlässig. Thumbnails möglich. Old School weil es früher keine guten Bordmittel für komplexe Layouts gab. |
== Template Switch über Backend Layout Feld (BE-Grids) == | == Template Switch über Backend Layout Feld (BE-Grids) == | ||
Version vom 23. Januar 2014, 16:10 Uhr
Diese Seite zeigt verschiedene Methoden um Templates auszuwählen
Template Switcher Extension
Funktioniert sehr zuverlässig. Thumbnails möglich. Old School weil es früher keine guten Bordmittel für komplexe Layouts gab.
Template Switch über Backend Layout Feld (BE-Grids)
ab 4.5
BE-Layouts definieren
- Ordner erstellen und Datensätze "Backendlayout" erstellen.
- Über TS den Ort der Layouts definieren (Zugriff für Redakteure nicht vergessen):
TypoScript
##id storagepage of gridlayout TCEFORM.pages.backend_layout.PAGE_TSCONFIG_ID=29 TCEFORM.pages.backend_layout_next_level.PAGE_TSCONFIG_ID=29 ##hide "no backend layout" label #TCEFORM.pages.backend_layout_next_level.removeItems= -1 #TCEFORM.pages.backend_layout.removeItems= -1 #give "empty" label a better name TCEFORM.pages.backend_layout.altLabels.0 = Vordefiniertes Layout
Frontend Anpassungen anhand backend_layout Feld
Beispiel CSS Klasse für Body-Tag
##... class for body tag (usefull for css definitions)
temp.selectbodytag = CASE
temp.selectbodytag {
key.field = backend_layout
key.ifEmpty.data = levelfield:-2, backend_layout_next_level, slide
default = TEXT
default.value = l1
1 = TEXT
1.value = l1
2 = TEXT
2.value = l2
3 = TEXT
3.value = l3
stdWrap.wrap = <body class ="|">
}
page.bodyTagCObject < temp.selectbodytag
Beispiel für Auswahl verschiedener Header Dateien
page.headerData.10 = CASE
page.headerData.10 {
stdWrap.wrap = <link rel="stylesheet" type="text/css" href="fileadmin/templates/css/|" media="all" />
key.data = levelfield:-1, backend_layout_next_level, slide
key.override.field = backend_layout
default = TEXT
default.value = layout1.css
2 = TEXT
2.value = layout2.css
3 = TEXT
3.value = layout3.css
}
Beispiel für Auswahl eines Fluid Templates
### FLUID ###
// include in fluid template via cObject Viewhelper: <f:cObject typoscriptObjectPath="lib.content" />
lib.content < styles.content.get
lib.contentLeft < styles.content.getLeft
lib.contentRight < styles.content.getRight
temp.myFluid = FLUIDTEMPLATE
temp.myFluid{
#file = fileadmin/templates/fluid/portal.html
partialRootPath = fileadmin/templates/fluid/partials/
layoutRootPath = fileadmin/templates/fluid/layouts/
variables {
// Variante: include in fluid template like this: <f:format.raw>{content}</f:format.raw>
# content < styles.content.get
# content.select.where = colPos = 0
# ...
}
file.cObject = CASE
file.cObject{
key.data = levelfield:-1, backend_layout_next_level, slide
key.override.field = backend_layout
default = TEXT
default.value = fileadmin/templates/fluid/portal.html
2 = TEXT
2.value = fileadmin/templates/fluid/1col.html
3 = TEXT
3.value = fileadmin/templates/fluid/2col.html
}
}
page.10 < temp.myFluid
Template Switch über FE-Layout Feld
Bezeichnungen anpassen
TypoScript
TCEFORM.pages.layout {
altLabels {
0 = 1 Spalter
1 = 2 Spalter
2 = Portalseite
}
removeItems = 3
}
Condition TypoScript
page.10 = TEMPLATE page.10.template = FILE page.10.template.file = fileadmin/templates/html/1col.html [globalVar = TSFE:page|layout = 1] page.10.template.file = fileadmin/template/html/2col.html [globalVar = TSFE:page|layout = 2] page.10.template.file = fileadmin/template/html/portal.html [global]
