Das Template

Wir kommen nun zum wesentlichen Teil von Typo3 - das Erstellen eines Templates.

Damit Typo3 überhaupt Seiteninhalte anzeigen kann, muss es wissen, wie die Inhalte gerendert werden und wo sie platziert werden.
Das alles passiert im Template.

Das Template hat eine eigene Scriptsprache, das TypoScript (kurz TS). Mit dieser werden wir uns nun beschäftigen.
Wir sollten uns bewusst machen, das wir beim Template am offenen Herzen des Systems operieren, und das ohne Erfahrung - aber nur Mut, Typo3 hat
genügend lebenserhaltene Massnahmen am Start

Wir begeben uns also gut ausgeschlafen in die OP. Links wählen wir "Template" aus und im Seitenbaum wählen wir unsere dafür vorgesehene Seite root aus.

Wir sehen folgendes Bild:

Bevor wir jetzt auf "Create template for a new site" klicken, lassen wir unseren Blick nach rechts oben gleiten. Wir entdecken eine Selectbox mit dem Menü für die Template-Sektion. Hier steckt unser Tisch mit dem notwendigen OP-Besteck. Daher eine kurze Erklärung, was sich dahinter verbirgt:

Constant Editor - hier können wir Werte einstellen, die für die gesamte Seite gelten wie maximale Bildgrössen, Linkziele etc.
Info / Modify - Der Punkt ist wichtig, um das Template zu verändern
TypoScript Object Browser - Hier sind alle Objekte von Typo3 in einem Baum dargestellt mit ihren Werten, können auch an Ort und Stelle verändert werden. Wir werden das oft brauchen, um uns Eigenschaften anzuschauen
Template Analyzer - wichtiges Werkzeug, um Fehler im Template aufzuspüren, vergleichbar mit PHP Fehlermeldungen incl. Zeilenangabe
CSS Style - veraltetes Werkzeug, das wir nicht brauchen. Wir arbeiten direkt an unserer CSS-Datei.

Ok, das soll uns als info genügen - wir wollen uns in die Action stürzen, also Mundschutz auf, Handschuhe an und flux auf den grossen Button geklickt ...

Es öffnet sich ein wahrlich imposantes Formular mit vielen Eingabefeldern.
Wir schauen uns unerschrocken das Formular von oben nach unten an.

Gut, fangen wir einfach an. Wir tragen ins oberste Feld einen Namen fürs Template ein, z.b. Root, als Website-Titel nehmen wir z.B. Typo3-Workshop.

Das Constants-Feld lassen wir leer. Hier kommen die Definitionen und Einstellungen rein, die für die gesamte Site gelten. Da werden wir später Einträge ergänzen.

Der wichtigste Teil ist das Setup-Feld. hier steht ja schon was drin, das schauen wir uns später genauer an.

Das Feld Resources dient zur Aufnahme von Bildern oder Icons, wir binden unsere Files aber auf dem üblichen Weg ein und brauchen das nicht.

Unter Clear und Rootlevel ist alles angehakt, und das ist auch richtig so. Es bedeutet, das alle Seiten unterhalb dieses Templates die Eigenschaften erben. Will man diese Vererbung unterbrechen, so fügt man an diese Stelle ein neues Template ein und hakt dort die Felder an, damit wird alles für die folgenden Seiten unwirksam und es gilt das neue Template ab dem Punkt. Lassen wir die Haken im neuen template weg, so können wir nur geringfügige Änderungen eintragen, der Rest gilt von unserem Root-Template.

Include static: Hier sind einige vorgefertigte Templates, die aber alle nicht berauschend sind. Wir benötigen keins davon.

Include static (from extensions): Hier sehen wir nur eine Auswahl, die css_styled_content. Diese wählen wir an.
Dies ist quasi unsere Rendering-Engine und sorgt dafür, das alle Inhalte in div-Containern landen und nicht in Tabellen, wie das in der Content (Default) deer Fall ist. Da wir ein CSS-Layout haben möchten, ist das unsere erste Wahl.

Der Rest interessiert uns erstmal nicht, wir speichern das Template ab.

Nun wollen wir natürlich sehen, was dies für Auswirkungen hat: Wir klicken auf das kleine Lupensymbol am oberen Rand und bestaunen unsere neue Seite.
Dort steht in grossen Lettern: HELLO WORLD!
Was ist das ? Will Typo3 mit uns reden ? Wo kommt das her, das haben wir doch nirgends eingetragen ?

Wir wollen der Sache auf den Grund gehen und öffnen unser Template zum bearbeiten. Hier brauchen wir nicht auf "Click here to edit whole template record" zu gehen, uns interessiert nur der Teil aus dem Setup-Feld. Wir klicken also links neben Setup auf den Bleistift.

Im Setup steht folgendes:

TypoScript
# Default PAGE object:
page = PAGE
page.10 = TEXT
page.10.value = HELLO WORLD!

Aha ! Hier steht also das Hello World. Aber was hat das zu bedeuten, wie funktioniert das ?

Dies ist der Einstieg in Typoscript, und damit wollen wir uns im Folgenden beschäftigen, da wir unsere Anweisungen in Typoscript formulieren müssen.

Typo3