Möchte man mehrere Layouts für eine Webseite nutzen kann man auf das Layout-feld der Seiteneigenschaften zurück greifen. Leider sind die Bezeichnungen nicht so aussagekräftig und die Anzahl ist auch nicht hoch.

Die Anzahl kann man mit addItems erhöhen. Die Bezeichnung mittels altLabels ändern. Für Layouts bevorzuge ich symbolische Bezeichnungen, aber es sind natürlich auch mehrsprachige Bezeichnungen möglich: siehe mehrere Inhaltsspalten.

Dazu trägt man im TSconfig der Root-Seite z.B. folgendes ein:

TCEFORM.pages.layout {
	addItems {
		4 = xxxx:xx
		5 = xx:xxxx
	}
	altLabels {
		0 = Flash+XXXXXXX
		1 = Flash+XXXX:XX
		2 = Flash+XX:XXXX
		3 = XXXXXXX
		4 = XXXX:XX
		5 = XX:XXXX
	}
}

Dabei muss man diese Angaben natürlich auch irgendwo auswerten und den verschiedenen Layouts zuordnen.

Das erfolgt normalerweise in einem TypoScript-Template wie

# layout: one part
temp.CONTENT < styles.content.get
temp.CONTENT.wrap = <div class="contentfull"> | </div>

[globalVar = TSFE:page|layout = 1] || [globalVar = TSFE:page|layout = 4]
# layout: 2 parts, 2 : 1
temp.CONTENT = COA
temp.CONTENT {
	10 < styles.content.get
	10.wrap = <div class="contentleft"> | </div>

	20 < styles.content.get
	20.select.where = colPos = 4
	20.wrap = <div class="contentright"> | </div>

	30 = TEXT
	30.value = <div style="clear:both"><!-- --></div>
}
[globalVar = TSFE:page|layout = 2] || [globalVar = TSFE:page|layout = 5]
# layout: 2 parts, 1 : 2
temp.CONTENT = COA
temp.CONTENT {
	10 < styles.content.get
	10.wrap = <div class="contentleft2"> | </div>

	20 < styles.content.get
	20.select.where = colPos = 4
	20.wrap = <div class="contentright2"> | </div>

	30 = TEXT
	30.value = <div style="clear:both"><!-- --></div>
}
[global]

page {
    10 = TEMPLATE
    10 {
        template= FILE
        template.file = {$path}html/template.html
        workOnSubpart = DOCUMENT
        marks {
          LOGO       < temp.logo
          FLASHAREA  < temp.flash
          FOOTER     < temp.footer
          MAINMENU   < temp.mainmenu
          SUBMENU    < temp.submenu

          CONTENT    < temp.CONTENT
          RIGHT      < temp.right
       }
     }
}
[globalVar = TSFE:page|layout = 3] || [globalVar = TSFE:page|layout = 4] || [globalVar = TSFE:page|layout = 5]
page.10.marks.FLASHAREA = COA
[global]

inzwischen gibt es ja die Backendlayouts mit denen man ganz schnell im BE ein Layout ähnlich dem FE anlegen kann, so dass sich Redakteure gut zurecht finden.

um jetzt nicht zwei Layouts parallel pflegen zu müssen läßt man den BE-Layout-Selektor natürlich auch das FE bestimmen. Da es neben der expliziten Zuweisung für die aktuelle Seite auch eien Vererbbare Einstellung gibt kann die Zuordnung etwas komplizierter werden. es sei denn man benutzt die Hilfsmittel von Typoscript.

## Assign the Template files with the Backend-Layout-Selector
page {
    10 = TEMPLATE
    10 {
        template = FILE
        template.file.cObject = CASE
        template.file.cObject {

    // wahlweise auch:
    10 = FLUIDTEMPLATE
    10 {
        file.cObject = CASE
        file.cObject {


            // get value from sliding field
            key.data = levelfield:-1, backend_layout_next_level, slide
            // override by individual value for this page
            key.override.field = backend_layout

            // now the template files
            # Default Template
            default = TEXT
            default.value = {$sysDir}/html/default.html

            // numbers match to uid of BE-Layouts
            # Standard
            1 < .default

            # Layout 2
            2 = TEXT
            2.value = {$sysDir}/html/layout2.html

            :
        }

        // now continue with marks/subparts ...
        workOnSubPart = DOCUMENT
        marks {

        // ... or settings
        settings {

            LOGO < temp.logo
            MENU < temp.menu
            :
        }
    }
}

gerade bei Fluidtemplates kann das Feld 'layout' dann auch einfach genutzt werden um irgendetwas an der Seite zu parametrisieren, da alle Felder der Seite im Template direkt verfügbar sind:

{f:if(condition:'{data.layout} == 1',then:'400',else:'500')}