ERROR: Content Element with uid "26" and type "menu" has no rendering definition!
Wie machen es andere?
Je nach Template Bauart gibt es verschiedene Lösungswege wie man mehrere Seiten Layoutsmit TYPO3 realisiert
TemplaVoliÃ
Mit TemplaVolià muss man fast zwingend für jedes Layout ein HTML Template erstellen und dies entsprechend mappen.
Extension
Es gibt auch Extensions, welche für die Wahl von unterschiedlichen Layouts verwendet werden können. Die Extension rlmp_tmplselector aus dem TER von TYPO3 wird wohl für dies am meisten verwendet.
typoscript
Bei reinen typoscript Lösungen sehe ich oft das per Conditions gleich ganze Templates ersetzt werden. Hier einige Beispiele, welche ich diesbezüglich gefunden habe.
In meinem Beitrag werde ich euch eine Lösungsvariante zeigen, welche ohne zusätzliche Extension und nur mit einem HTML Template auskommt.
Als erstes muss man dafür das Template entsprechend umbauen.
Umbau des HTML Templates
Bisher wurden im Template die Marker dafür verwendet, das nur Content aus dem TYPO3 angezeigt wird.
Diesen Bereich bauen wir nun wie folgt um, so das der ganze HTML Code der Spalte im TYPO3 erstellt werden muss.
Anpassen des Backends mittels TS Config
Bei den Seiteneigenschaften kann man im Backend ein Layout wählen. In der Standard Version sieht dies so aus.
Ziel ist es, anhand dieser Auswahl das Layout der Seite zu verädern. Durch Eingabe von TS Config Code kann man die Labels dieser Auswahl anpassen.
In diesem Beispiel wieder als externe TS Config Datei, welche eingebunden wird.
Mit den || kann man die Labels in den entsprechenden Sprachen angeben, wobei das erste immer das Default Label ist.
Wie man mit dieser Auswahl das Template verädern kann ist einigen nicht wirklich bekannt. Aus diesem Grund folgt jetzt mein Lösungsvorschlag.
Erweitern des TypoScript Codes
Weil der HTML Code der 3 Spalten aus dem Template entfernt wurde, muss dies jetzt mit typoscript gelöst werden. Für die Formatierung von HTML Code innerhalb dem typoscript Code gibt es verschiedene Lösungswege, somit kann jeder selber festlegen, welche Variante einem mehr zusagt.
Im weiteren Verlauf werde ich vorerst die Variante 2 wählen.
Die Marker welche zuvor nur den Content styles.content.get ausgegeben haben werden mit dem benötigten HTML Code erweitert.
Layouts mittels TYPO3 Conditions beeinflussen
Mit diesem Lösungsvorschlag muss man somit nicht das ganze HTML Template auswechseln, sondern je nach Wunsch nur bestimmte Marker verädern. Im TYPO3 kann man dies mit sogenannten Conditions lösen.
Je nach Auswahl des Layouts werden durch die Conditions nicht benötigte Marker entfernt. In diesem Beispiel benötigen wir TSFE:page|layout.
Layouts mittels CSS Code beeinflussen
Auch wenn es nicht wirklich zu Empfehlen ist, könnte man Layouts auch nur durch entsprechenden CSS Code verädern. Das heisst, die HTML Spalten technisch im Code belassen, aber optisch mit CSS Code ausblenden.
Oft habe ich schon gesehen das unterschiedliche CSS Dateien eingebunden werden, um dies zu realisieren. Auch dies geht ebenfalls mit kleinen Anpassungen nur mit einer CSS Datei.
Lösungsvorschlag
Mein Lösungsvorschlag sieht in diesem Fall wie folgt aus. Zuerst machen wir die CSS Class des Body Elements dynamisch. Dazu passen wir das HTML Template an.
<body class="###BODY_CLASS###">
html body tag mit class
Diesen Marker füllen wir entsprechend im typoscript Code ab.
BODY_CLASS = TEXT
BODY_CLASS.dataWrap = layout{page:layout} language{TSFE:sys_language_uid} type{TSFE:type} pid{TSFE:id} {field:alias}
das sind etwas mehr als die benötigten felder ;-)
Wenn mit PAGE.bodyTagCObject gearbeitet wird, würde der Code etwa so aussehen.
PAGE.bodyTagCObject = TEXT
PAGE.bodyTagCObject {
value = <body class="layout{field:layout} language{TSFE:sys_language_uid} type{TSFE:type} pid{TSFE:id} {field:alias}">
insertData = 1
}
Ãœber die CSS Class layout{page:layout} ist jetzt das entsprechende Layout veräderbar.
Als nächstes erstellen wir eine CSS Datei für die Layouts, welche entsprechend im aktuellen HTML Template eingebunden wird.
Weil das Layout nur im Backend geädert werden kann, aber ich euch gerne zeigen möchte wie dies funktioniert, habe ich auf der Beispiel Seite eine kleine Demo eingebunden. Damit kann das Layout der Seite über einen URL Parameter verädert werden.
Bitte schaut euch den nächsten Absatz an, weshalb ihr über URL Parameter nicht das Template der Seite verädern solltet!
# demo only
[globalVar = GP:layout = 1]
temp.htmlTemplate {
marks {
BODY_CLASS = TEXT
BODY_CLASS.dataWrap = layout1
}
}
[global]
[globalVar = GP:layout = 2]
temp.htmlTemplate {
marks {
BODY_CLASS = TEXT
BODY_CLASS.dataWrap = layout2
}
}
[global]
[globalVar = GP:layout = 3]
temp.htmlTemplate {
marks {
BODY_CLASS = TEXT
BODY_CLASS.dataWrap = layout3
}
}
[global]
Technisch gesehen verädere ich damit den MarkerBODY_CLASS und somit das gesamte Template der Seite.
Das HTML Gerüst bleibt unverädert, mit CSS werden die nicht gewünschten Spalten ausgeblendet.
Stolperfalle TYPO3 Cache - was man beachten muss
Wenn durch Conditions Änderungen im Template oder im Seitenaufbau verursacht werden, vergisst man oft, das TYPO3 pro Variante eine Seite im Cache anlegt.
In meiner Demo wird zwar nur die CSS Class verädert, trotzdem speichert TYPO3 jede Seite pro URL Parameter in der Datenbank ab.
Bei einer Seite mag das gehen, sobald aber alle Seiten in 4 Varianten in der Datenbank gespeichert werden zählt sich das rasch zusammen.
Vielfach sehe ich auch das Conditions für Browser Varianten gemacht werden. Auch hier verhält sich TYPO3 gleich und deshalb rate ich von Browserweichen mittels Conditions ab.
Sicherlich denkt sich nun der eine oder andere, das mein Lösungsvorschlag auch Conditions verwendet. Da es sich jedoch um ein Feld im Backend handelt, kann es nur beim Wechsel des Layouts kurzzeitig zu mehreren Varianten in der Datenbank führen. Sobald der Cache gelöscht wird, kann nur die eine Variante gespeichert werden.
Dies war Schritt 5!
Vielen Dank für's rein schauen.
thefox