| Weitere Artikel aus dem Webentwickler Blog |
| Teilen |  |
 |
 |
Neben dem Inhalten der bereits beschriebenen Tabelle tt_content wollen wir auch noch die CSS-Datei verwenden, die der Webdesigner geliefert hat. Hier gibt es zwei Möglichkeiten:
Die erste Variante zeigt das folgende Listing.
page.includeCSS {
file1 = fileadmin/templates/simple/styles.css
file1.media = all
}
In diesem Beispiel wird die CSS-Datei in die TYPO3-Ausgabe mit eingefügt.
Alternativ lässt sich auch hier die Template-Methode benutzen. Dazu wird im Header der HTML-Vorlage ein weiterer Subpart-Marker eingefügt und wie folgt eingebunden:
page.headerData.10 = TEMPLATE
page.headerData.10 {
template = FILE
template.file = fileadmin/templates/simple/index.html
workOnSubpart = DOCUMENT_HEADER
}
Der Vorteil dieser Methode ist, dass sehr bequem nicht nur die CSS-Datei, sondern auch andere Header-Einträge, etwa Javascript-Dateien, ohne Nacharbeit so übernommen werden, wie es der Webdesigner vorgesehen hat. In unserem Beispiel haben wir allerdings den <title>-Tag ausgespart, weil dieser von TYPO3 eingefügt werden soll. Auch <meta>-Tags sollten normalerweise nicht über das Template definiert werden.
Automatische Templates
Wie bereits beschrieben, sorgt der Einbau der Marker in ein Template von Hand für diverse Probleme, wenn es darum geht, dass eine HTML-Vorlage nachträglich vom Webdesigner bearbeitet werden soll. Besser wäre es, wenn TYPO3 selbst die Struktur der HTML-Datei erkennen könnte.
Genau dies leistet der Template Auto-Parser von Kasper Skårhoj. Um die Erweiterung zu installieren, gehen Sie in den Extension Manager und suchen im Online-Repository nach der Erweiterung mit der Kennung automaketemplate.
Das wichtigste Argument für den Auto-Parser ist, dass Änderungen von Hand an der HTML-Vorlage nicht mehr notwendig sind. Stattdessen konfigurieren Sie den Auto-Parser so, dass vorhandene HTML-Elemente automatisch mit Subpart-Markierungen versehen werden. Dazu wird der Parser in das Typoscript-Template eingebunden:
plugin.tx_automaketemplate_pi1 {
# Einlesen der HTML-Vorlage:
content = FILE
content.file = fileadmin/template/auto/index.html
# Festlegung, welche Elemente mit Markern versehen werden:
elements {
BODY.all = 1
BODY.all.subpartMarker = DOCUMENT_BODY
HEAD.all = 1
HEAD.all.subpartMarker = DOCUMENT_HEADER
HEAD.rmTagSections = title
DIV.all = 1
UL.all = 1
}
# Relative Pfade automatisch anpassen:
relPathPrefix = fileadmin/template/auto/
}
Der Beginn ist dem alten TEMPLATE-Objekt sehr ähnlich. Neu ist der elements-Block. Dieser legt fest, welche HTML-Tags ersetzt werden.
Die folgende Befehlsfolge
BODY.all = 1
BODY.all.subpartMarker = DOCUMENT_BODY
sorgt dafür, dass nach dem <body>-Tag der Marker ###DOCUMENT_BODY### eingefügt wird. Genau genommen würde diese Anweisung alle <body>-Tags ersetzen, doch da er nur einmal vorkommt, stellt dies kein Problem dar.
Ganzen Artikel lesen...
Robert Steindl
Lernen Sie die ganze Vielfalt vom Franzis Buch- und Softwareverlag kennen
